我正在尝试从一组div上包含的三个输入中获取值，但只有不属于invisible-age-range-row的那些edivs
<div class="row">
<div class="col-md-7 col-xs-12 dist-element-row">
<label>Franjas de edad</label>
<div class="row age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from" value="1">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to" value="2">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage" value="20">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from" value="3">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to" value="4">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage" value="5">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
<div class="row age-range-row invisible-age-range-row">
<div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
</div>
</div>
我通过这种方式获取div
var ranges = $('.age-range-row').not('.invisible-age-range-row');
但是我不能以这种方式访问输入值：
ranges.each(function(range) {
var elements = [];
console.log(range);
elements.push(range.find('.from'));
elements.push(range.find('.to'));
elements.push(range.find('.percentage'));
stored_ranges.push(elements);
});
答案 0 :(得分：1)
每个函数的第一个参数引用元素的索引。您需要使用range作为第二个元素才能用作元素选择器：
ranges.each(function(index,range){
var elements = [];
console.log(range);
elements.push(range.find('.from'));
elements.push(range.find('.to'));
elements.push(range.find('.percentage'));
stored_ranges.push(elements);
});
答案 1 :(得分：0)
您应该记住每个参数都有2个参数。
使用$（range）代替范围。
var ranges = $('.age-range-row').not('.invisible-age-range-row');
ranges.each(function(index, range){
if(!$(this).hasClass('invisible-age-range-row')){
var elements = [];
console.log(range);
elements.push($(range).find('.from'));
elements.push($(range).find('.to'));
elements.push($(range).find('.percentage'));
//stored_ranges.push(elements);
}
});
var ranges = $('.age-range-row').not('.invisible-age-range-row');
ranges.each(function(index, range){
if(!$(this).hasClass('invisible-age-range-row')){
var elements = [];
console.log(range);
elements.push($(range).find('.from'));
elements.push($(range).find('.to'));
elements.push($(range).find('.percentage'));
//stored_ranges.push(elements);
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
<div class="col-md-7 col-xs-12 dist-element-row">
<label>Franjas de edad</label>
<div class="row age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from" value="1">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to" value="2">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage" value="20">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from" value="3">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to" value="4">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage" value="5">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
</div>
</div>
答案 2 :(得分：0)
使用hasClass检查类invisible-age-range-row是否存在，使用val()获取输入值，希望有帮助
（或）
使用not
var ranges = $('.age-range-row').not('.invisible-age-range-row')
ranges.each(function(e){
var elements = [];
elements.push($(this).find('.from').val());
var ranges = $('.age-range-row');
var stored_ranges=[];
ranges.each(function(e){
var elements = [];
if(!$(this).hasClass('invisible-age-range-row')){
elements.push($(this).find('.from').val());
elements.push($(this).find('.to').val());
elements.push($(this).find('.percentage').val());
stored_ranges.push(elements);
}
});
console.log(stored_ranges)<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<div class="row">
<div class="col-md-7 col-xs-12 dist-element-row">
<label>Franjas de edad</label>
<div class="row age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from" value="1">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to" value="2">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage" value="20">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from" value="3">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to" value="4">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage" value="5">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
</div>
</div>
答案 3 :(得分：0)
$('.age-range-row').not('.invisible-age-range-row').each(function(index, range){
//if(!$(this).hasClass('invisible-age-range-row')){
var elements = [];
console.log(range);
elements.push($(range).find('.from'));
elements.push($(range).find('.to'));
elements.push($(range).find('.percentage'));
//stored_ranges.push(elements);
//}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
<div class="col-md-7 col-xs-12 dist-element-row">
<label>Franjas de edad</label>
<div class="row age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from" value="1">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to" value="2">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage" value="20">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from" value="3">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to" value="4">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage" value="5">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div><div class="row age-range-row invisible-age-range-row"><div class="col-md-2">
<label>Desde</label>
<input type="number" min="0" class="form-control from">
</div>
<div class="col-md-2">
<label>Hasta</label>
<input type="number" min="0" class="form-control to">
</div>
<div class="col-md-2">
<label>%</label>
<input type="number" min="0" max="100" class="form-control percentage">
</div>
<div class="col-md-6 options-cell">
<button class="btn btn-primary add-range">+</button>
<button class="btn btn-default delete-range">-</button>
</div>
</div>
</div>
</div>