如何检查select选项中的所有值是否与javascript相同？

Question

如果我有这样的html。

<select multiple="" class="form-control" id="catalogsearch_specification2">

<option value="B-3-7">aaa</option>
<option value="B-3-7">bbb</option>
<option value="B-3-7">ccc</option>
<option value="B-3-7">ddd</option>

</select>

如何检查select选项中的所有值是否与javascript相同？

Answer 1

你可以：

​

var isSame = true,
    prev = '';

$('#catalogsearch_specification2 > option').each(function() {
  if (prev && prev !== this.value) {
    isSame = false;
    return;
  }
  
  prev = this.value;
});

console.log(isSame);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select multiple="" class="form-control" id="catalogsearch_specification2">
  <option value="B-3-7">aaa</option>
  <option value="B-3-7">bbb</option>
  <option value="B-3-7">ccc</option>
  <option value="B-3-7">ddd</option>
</select>

​

Answer 2

使用Set对象检查每个option元素是否具有相同的value属性。如果是这样的话--使用Array#forEach对其中的每一个应用selected支柱。

​

let parent = document.getElementById('catalogsearch_specification2'),
    values = Array.from(parent.children).map(v => v.value);
    
    [...new Set(values)].length == 1 ? Array.from(parent.children).forEach(v => v.selected = true) : null;

<select multiple="" class="form-control" id="catalogsearch_specification2">
  <option value="B-3-7">aaa</option>
  <option value="B-3-7">bbb</option>
  <option value="B-3-7">ccc</option>
  <option value="B-3-7">ddd</option>
</select>

​

Answer 3

这个片段将帮助您理解如何从子节点检索值.

​

var obj = {};
var i = 0
$("#catalogsearch_specification2 option").each(function() {
  //You can write you logic here.
  
  if(!obj.hasOwnProperty(this.value)) {
    obj[this.value] = {"value" : this.value, "duplicate" : 1};
  } else {
    obj[this.value].duplicate = (obj[this.value].duplicate) + 1;
  }
  
});

console.log(JSON.stringify(obj));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select multiple="" class="form-control" id="catalogsearch_specification2">

<option value="B-3-7">aaa</option>
<option value="B-3-7">bbb</option>
<option value="B-3-7">ccc</option>
<option value="B-3-7">ddd</option>

</select>

​

这里我使用id "catalogsearch_specification2“的所有子选项元素。