Question

如何使用jQuery分隔所有选项逗号分隔的所有文本内容？选择字段本身的值仅是当前所选选项的值。

const foo = $('#selector').val()
document.write(foo)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="selector" id="selector">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

我想要这样的结果

Option 1, Option 2,Option 3

Answer 1

对each执行options功能，将其推送到array，然后执行join功能。

var collected = [];
var foo = $('#selector option').each(function() {
  collected.push($(this).text());
}); 

console.log(collected.join(','));

.as-console-wrapper {
  max-height: 100% !important
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="selector" id="selector">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
 <option value="3">Option 3</option>
</select>

Answer 2

＆＃13;

let arr = []
$('select > option').each((i, {innerHTML}) => arr.push(innerHTML))

console.log(arr)

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="selector" id="selector">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

＆＃13;

在这里，我查询了select的选项，它给了我一系列元素。我循环使用这些元素并将他们各自的innerHTML推送到arr。

使用Array.prototype.join()将该数组缩减为字符串： - ）

Answer 3

您可以遵循简单的逻辑：

循环遍历<option>元素
从每个<option>元素中获取文本并将其推送到数组。
使用toString()对数组进行字符串化，并将值设置为逗号分隔。

var optionsArray = [];
//loop over each option element
var optionElements = $('#selector option').each(function() {
  //push the text of option in the array
  optionsArray.push($(this).text());
}); 
//stringify the array to get the comma seperated result
console.log(optionsArray.toString());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="selector" id="selector">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
 <option value="3">Option 3</option>
</select>

Answer 4

Source               Target (after converting to lower case)
ID | NAME | AGE      id | name | age
1  | xxx  | 10       1  | xxx  | 10
2  | yyy  | 20       2  | yyy  | 20

将为您选择文本而不是值。

如何获取选择输入字段中所有选项的文本

4 个答案: