Question

我有一些动态数量的select元素，当提交表单时，我想检查是否已经使用JQuery多次选择了相同的选项。如果它然后显示错误。有什么想法吗？

<div class="container-seller-commission">
            <div class="row-seller-commission">
                <select name="seller" id="seller" class="select-seller valid"><option value=""></option><option value="4" selected="selected">Agent</option>
    <option value="2">Crisalix Global</option>
    <option value="1">Owner</option>
    <option value="3">Support</option></select>
              </div>

            </div>
        <div class="row-seller-commission">
             <select name="seller" id="seller" class="select-seller valid"><option value=""></option><option value="4" disabled="disabled">Agent</option>
    <option value="2" selected="selected">Crisalix Global</option>
    <option value="1">Owner</option>
    <option value="3">Support</option></select>
            </div>
    <div class="row-seller-commission">

                <select name="seller" id="seller" class="select-seller valid"><option value=""></option><option value="4" disabled="disabled">Agent</option>
    <option value="2">Crisalix Global</option>
    <option value="1" selected="selected">Owner</option>
    <option value="3" disabled="disabled">Support</option></select>

            </div></div>

Answer 1

这非常简单，将所有选择的值放入数组中，确定数组中的所有项是否都是唯一的

＆＃13;

$('button').on('click', function(){
    var items = $('.select-seller').map(function(){
      return $(this).val();
    }).get();
  
  console.log(isUnique(items));
});

function isUnique(arr){
   var uniqueValues = arr.reduce(function(p,c){
     if(p.indexOf(c) < 0) p.push(c);
     return p;
    },[]);
  
  return uniqueValues.length == arr.length;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container-seller-commission">
            <div class="row-seller-commission">
                <select name="seller" id="seller" class="select-seller valid"><option value=""></option><option value="4" selected="selected">Agent</option>
    <option value="2">Crisalix Global</option>
    <option value="1">Owner</option>
    <option value="3">Support</option></select>
              </div>

            </div>
        <div class="row-seller-commission">
             <select name="seller" id="seller" class="select-seller valid"><option value=""></option><option value="4" disabled="disabled">Agent</option>
    <option value="2" selected="selected">Crisalix Global</option>
    <option value="1">Owner</option>
    <option value="3">Support</option></select>
            </div>
    <div class="row-seller-commission">

                <select name="seller" id="seller" class="select-seller valid"><option value=""></option><option value="4" disabled="disabled">Agent</option>
    <option value="2">Crisalix Global</option>
    <option value="1" selected="selected">Owner</option>
    <option value="3" disabled="disabled">Support</option></select>

            </div></div>

<button>test</button>

＆＃13;

请确保您为html元素提供唯一ID！

检查是否在select元素组中多次选择了相同的选项

1 个答案: