开发者

How to get four following text inputs after each checkbox?

开发者 https://www.devze.com 2023-02-04 05:48 出处:网络
I am traversing checkboxes like this: $(\'.day\').each(function() { // here I need to get the following 4 text inputs in the HTML

I am traversing checkboxes like this:

$('.day').each(function() {
// here I need to get the following 4 text inputs in the HTML 
    // and set some attributes on them      
});

After every checkbox there are four text input fields (there are also some div, span tags for CSS around them). So inside the loop above I need to get four text input fields that follow the checkbox in the HTML source so I can set some attributes on them.

How would I go 开发者_如何转开发about that?


Hard to say without the markup, but you could try this.

$('.day').each(function() {
    $(this).nextAll('input').slice(0,4).attr('someAttribute','somevalue');    
});

If there's some stopping point, like another .day element, you could use nextUntil then .filter().

$('.day').each(function() {
    $(this).nextUntil('.day').filter('input').attr('someAttribute','somevalue');    
});

EDIT: When you say there are some <div> and other tags around them, I assumed that you meant in between them.

If you're actually saying that the inputs are nested in them, then you could do something like this:

$('.day').each(function() {
    $(this).nextAll(':has(input)').slice(0,4).find('input').attr('someAttribute','somevalue');    
});

or perhaps this:

$('.day').each(function() {
    $(this).nextAll().find('input').slice(0,4).attr('someAttribute','somevalue');    
});

or again, if there's a stopping point you can indicate like another .day, use nextUntil():

$('.day').each(function() {
    $(this).nextUntil('.day').find('input').attr('someAttribute','somevalue');    
});


if they are siblings within a parent container, you might be able to use $(this).nextAll('input').each(function(){}); or $(this).nextAll().find('input').each(function(){}); depending on your html structure. Or var p = $(this).parent(); if (p && p[0]) p[0].find('input').each(function(){});


This is a total guess, since you've shown no markup whatsoever:

$('.day').each(function() {
    var $this = $(this);
    var $inputs = $this.nextAll('input[type=text]');
    $inputs.each(function () {
        // do whatever with the inputs here
    });
});


if your trying to set css properties to the inputs you can use css selectors which are quite powerful, like this

.day ~ input {
  //set your styles for the input
}

what this means is you are selecting all the inputs exactely after .day

hope this helps.


Try

$('.day').each(function() {
     // get input fields
     var first_input = $(this).nextAll().filter('input:first');
     var second_input = first_input.nextAll().filter('input:first');
     var third_input = second_input.nextAll().filter('input:first');
     var fourth_input = third_input.nextAll().filter('input:first');

     // set attribute xyz to value
     first_input.attr('xyz', 'value');
     second_input.attr('xyz', 'value');
     third_input.attr('xyz', 'value');
     fourth_input.attr('xyz', 'value');
});
0

精彩评论

暂无评论...
验证码 换一张
取 消