0

我有一个包含 10 个左右下拉菜单的表单。其中两个下拉列表与其他下拉列表不同，我试图弄清楚如何不让用户在每个下拉列表中具有相同的值。

例如，

<select id="z_one">
   <option>1</option>
   <option>1</option>
   <option>1</option>
</select>

<select id="z_two">
   <option>1</option>
   <option>1</option>
   <option>1</option>
</select>

有没有办法只遍历这两个选择，而不是其他的，并检查匹配的值？

$('select[id^=z_]').change(function() {
   var value = $(this);
   $(this).siblings().each(function() { //this checks all siblings. do not want.
   if ($(this).val() == value.val()) {
      alert("You can't select the same value twice.");
      return false;
      }
   });
});

此 jquery 代码遍历页面上的所有选择，而不仅仅是我要检查的两个。有没有办法做到这一点？

4

3 回答 3

1

在您对兄弟姐妹的调用中尝试某种谓词，以将其限制为仅这两个选择。

就像是

this.siblings("[id = 'z_two']")

例如。

于 2012-05-29T20:22:44.363 回答
1

代替

$(this).siblings().each(

利用

$(this).next('select[id^=z_]').each(
于 2012-05-29T20:19:44.393 回答
0

我已经稍微改变了你的 html。

<select id="z_one" class='groupA'>
   <option>Select an element</option>
   <option>1</option>
   <option>2</option>
   <option>3</option>
</select>

<select id="z_two" class="groupA">
   <option>Select an element</option>
   <option>1</option>
   <option>2</option>
   <option>3</option>
</select>

这是JS代码：

$(function(){

    $('.groupA').change(function(){

        var currentID = this.id;
        var currentVal = $(this).val();

        var $options = $('option','.groupA');
        var $jThis = $(this);

        var isMatched = false;

        $.each($options,function(index,element){

            if(element.parentNode.id != currentID ){

                var $prevDropDown = $('#' + element.parentNode.id);

                if($prevDropDown.val() == currentVal){

                   $jThis.get(0).selectedIndex = 0;
                   alert("You can't select the same value twice.");
                   isMatched = true;
                   return false; // to break out from $.each
                }


            }
        });

        if(isMatched)
            return false;     
    });


});
于 2012-05-29T21:03:27.947 回答