Question

问题是：两个下拉菜单不能选择相同的选项。

创建动态多个下拉菜单。由于它的动态id不能用于我的jquery验证。所以，我尝试使用类进行验证。但我无法为它编写正确的验证jquery代码。请帮我。

Answer 1

使用javascript设置。 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set

下面的

运行代码段在两个下拉菜单中选择相同的值并点击提交您将收到验证错误

$(document).ready(function() {


  var arr = [{
    val: 1,
    text: 'One'
  }, {
    val: 2,
    text: 'Two'
  }, {
    val: 3,
    text: 'Three'
  }, {
    val: 4,
    text: 'Four'
  }, {
    val: 5,
    text: 'Five'
  }, {
    val: 6,
    text: 'Six'
  }];

  var sel = $('<select>').appendTo('#container');
  var sel2 = $('<select>').appendTo('#container');
  $(arr).each(function() {
    sel.append($("<option>").attr('value', this.val).text(this.text));
    sel2.append($("<option>").attr('value', this.val).text(this.text));
  });

  $('select').change(function(event) {
    var myArray = [];
    $("select").each(function() {
      myArray.push($(this).val())
    })
    if (myArray.length != new Set(myArray).size) {
      alert('validation failed');
    }
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="container">
</div>

验证具有动态多次下拉的下拉列表

1 个答案: