我想知道是否有办法将包含元素集合的jQuery选择器拆分为一个选择器数组,每个元素一个。例如,我有:
fields = row.find('input');
返回包含多个输入元素的选择器。我知道我可以使用
fields.eq(index).val()
访问单个值,但有一种简单的方法来构造或将字段转换为选择器数组,所以我可以使用
fields[index].val()
是的,我意识到你可以使用.toArray(),但正如下面所指出的那样,它返回一个DOM元素数组。然后你必须循环将这些转换为选择器 - 太多额外的工作。
答案 0 :(得分:3)
一个小插件怎么样为你做这个?
$.fn.toJqArray = function(){
var arr = [];
$(this).each(function(){
arr.push($(this));
});
return arr;
};
var inputs = $('input').toJqArray();
var value = inputs[0].val();
答案 1 :(得分:2)
如果您使用纯javascript,则可以通过数组访问输入,但如果您需要使用jQuery,则可以进行循环:
var arrFields = [];
fields.each(function() {
arrFields.push($(this).val());
});
console.log(arrFields);
祝你好运!
答案 2 :(得分:1)
您可以使用jQuery .toArray()
:
var arr = fields.toArray();
console.log(arr[0].value)
您不能在此使用.val()
,但.value
可以正常使用。
一个小例子/概念证明:
var fields = $('input').toArray();
$.each(fields, function(i, o) {
console.log(o.value + ' == ' + fields[i].value)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input name="a" value="a" />
<input name="b" value="b" />
<input name="c" value="c" />
<input name="d" value="d" />
答案 3 :(得分:1)
您可以同时使用jQuery toArray() function
或jQuery.makeArray() function
它们都将返回一个DOM元素数组。
区别在于 toArray
函数只将jQuery结果对象转换为数组:
$("p").toArray(); // correct
$.makeArray
更具多功能性和复杂性。它将任何类似数组的对象转换为正确的 JS数组。
例如,
var elems = document.getElementsByTagName("p");
实际上返回类似数组的nodeList
,但不是数组。
你做不到:
var elems = document.getElementsByTagName("div");
elems.reverse(); // error. reverse() is not part of nodeList
但是,你可以做到
var elems = document.getElementsByTagName("div");
var arr = $.makeArray(elems);
arr.reverse(); // ok. arr is a JS array which has reverse() function
但是,在转换jQuery选择结果的情况下 - 它们之间没有区别。
看看下面的代码片段,它选择jQuery,以两种不同的方式将这个jQuery对象转换为两个JS数组,并使用非jQuery DOM innerHTML
属性。
var pJquery = $("p");
var pArray1 = pJquery.toArray();
var pArray2 = $.makeArray(pJquery);
document.getElementById('output').innerHTML = pArray1[1].innerHTML;
document.getElementById('output').innerHTML += pArray2[2].innerHTML;
p
{
color: #FF0000;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>1</p>
<p>2</p>
<p>3</p>
<div id="output"></div>
答案 4 :(得分:1)
你可以这样做:
var $input = $("input");
var $$input = $input.map(function() {
return $(this);
}).get();
console.log($input instanceof Object); // true
console.log($input instanceof jQuery); // true
console.log($$input instanceof Array); // true
$input.eq(3).val("test");
$$input[3].val("test");
但这很荒谬。
答案 5 :(得分:0)
是的,您可以使用.toArray()
var fieldsArray = [];
fieldsArray = fields.toArray();
答案 6 :(得分:-2)
每个html元素,如果它没有id,则不保证拥有唯一的选择器。