jquery从JSON数组中的选择框中收集所有选项值

时间:2022-01-09 12:11:34

I have a select box.

我有一个选择框。

<select id='x'>
    <option value='1'>'Vineet'</option>
    <option value='2'>'Vivek'</option>
    <option value='3'>'Madhu'</option>
</select>

The options are added dynamically to it. At the end, I want to collect the values of ALL option elements contained within this select box into an array. I searched the forum for the answer, but Q/A are there for getting the 'selected' option only.

选项会动态添加到它。最后,我想将此选择框中包含的所有选项元素的值收集到一个数组中。我在论坛上搜索了答案,但Q / A仅用于获取“选定”选项。

I tried this:

我试过这个:

var myList = [];
$('#x').each(function() { myList.push( $(this).value() ) });

In firebug, It gives this error:

在firebug中,它给出了这个错误:

missing } after property list

在属性列表之后丢失}

But I fail to see any missing }. What am I doing wrong here?

但我没有看到任何失踪}。我在这做错了什么?

2 个解决方案

#1


11  

You need to loop through each option element within the select, not just the select itself, also, the correct method to get the value of an input in jQuery is val(), try this:

你需要遍历select中的每个选项元素,而不仅仅是select本身,同样,在jQuery中获取输入值的正确方法是val(),试试这个:

myList = [];
$('#x option').each(function() {
    myList.push($(this).val())
});

Example fiddle

示例小提琴

You can also use map():

你也可以使用map():

var myList = $('#x option').map(function() {
    return this.value;
}).get();

In both cases, the myList variable will contain an array of strings.

在这两种情况下,myList变量都将包含一个字符串数组。

#2


1  

Try jQuery function for getting the value of an element (wrapped in a jQuery object) is .val(), not .value() - that may be causing some confusion, though I can't be sure.

尝试使用jQuery函数来获取元素的值(包装在jQuery对象中)是.val(),而不是.value() - 这可能会引起一些混乱,尽管我无法确定。

As a side note, your selector is incorrect for what you want. $('#x') will return all of the elements that have an id of x - which should only ever be one element - then the .each() will iterate over that set of elements (so it will call the function once). You'll just end up with an array that contains a single value, which will be the currently selected value of the <select> input.

作为旁注,您的选择器不符合您的要求。 $('#x')将返回所有id为x的元素 - 它应该只是一个元素 - 然后.each()将遍历那组元素(因此它将调用该函数一次) 。您最终会得到一个包含单个值的数组,该值将是

Instead, use $('#x > option') which will return all <option> elements that are immediate children of the <select> element with the id of x.

相反,使用$('#x> option')将返回所有

#1


11  

You need to loop through each option element within the select, not just the select itself, also, the correct method to get the value of an input in jQuery is val(), try this:

你需要遍历select中的每个选项元素,而不仅仅是select本身,同样,在jQuery中获取输入值的正确方法是val(),试试这个:

myList = [];
$('#x option').each(function() {
    myList.push($(this).val())
});

Example fiddle

示例小提琴

You can also use map():

你也可以使用map():

var myList = $('#x option').map(function() {
    return this.value;
}).get();

In both cases, the myList variable will contain an array of strings.

在这两种情况下,myList变量都将包含一个字符串数组。

#2


1  

Try jQuery function for getting the value of an element (wrapped in a jQuery object) is .val(), not .value() - that may be causing some confusion, though I can't be sure.

尝试使用jQuery函数来获取元素的值(包装在jQuery对象中)是.val(),而不是.value() - 这可能会引起一些混乱,尽管我无法确定。

As a side note, your selector is incorrect for what you want. $('#x') will return all of the elements that have an id of x - which should only ever be one element - then the .each() will iterate over that set of elements (so it will call the function once). You'll just end up with an array that contains a single value, which will be the currently selected value of the <select> input.

作为旁注,您的选择器不符合您的要求。 $('#x')将返回所有id为x的元素 - 它应该只是一个元素 - 然后.each()将遍历那组元素(因此它将调用该函数一次) 。您最终会得到一个包含单个值的数组,该值将是

Instead, use $('#x > option') which will return all <option> elements that are immediate children of the <select> element with the id of x.

相反,使用$('#x> option')将返回所有