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

使用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 2

此代码段将帮助您了解如何从子节点检索值。

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”的所有子选项元素。

Answer 3

你可以这样做：

＆＃13;

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

＆＃13;

<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>

＆＃13;

Answer 4

您可以通过多种方式查看。这是一个解决方案。获取第一个选项值并使用该值计算选项的总数。并再次计算总期权价值。如果计数相同，则所有选项值都相同，否则不相同。

$(function(){
    var firstValue = $('#catalogsearch_specification2').find("option:first-child").val();
    if($('#catalogsearch_specification2 option[value="'+firstValue+'"]').length == $('#catalogsearch_specification2 option').length){
        console.log("All values are same");
    }else{
        console.log("All values are not same");
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.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-1">ddd</option>

</select>

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

4 个答案: