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');
});
精彩评论