0

我已经通过stackoverflow查看了答案，并且几乎就在那里，但需要一些帮助。

我有多个下拉列表，其中包含相同的选项。例如，三个相同的列表具有以下内容：

<label for='distlist_1'>Distribution List 1</label> 
<select name='distlist_1'> 
<option value=''>Please Select:</option> 
<option value='1'>All</option> 
<option value='2'>All Managers</option>
<option value='3'>Leavers</option>
</select>

唯一的区别是名称，例如 distlist_1、2、3 等。如有必要，我可以添加 ID。

当用户在第一个下拉列表中选择一个选项时，我需要将其从所有其他下拉列表中删除。我找到了一个执行此操作的脚本。

$('option').click(function(){
$('option:contains(' + $(this).html() +')').not(this).remove();
});

但我需要它，以便如果用户随后决定“等等，我毕竟不需要下拉列表 1 中的那个选项”，她会选择其他内容，并且该选项会重新出现在其他下拉列表中。上面的代码删除了选项，然后没有办法检索它们，直到你点击足够多的时候它们都消失了。

4

2 回答 2

0

我最终使用了它，因为它很简洁......

jQuery(document).ready(function() {
var selects = $('.mapping')

selects.change(function() {
var vals = {};
selects.each(function() {
vals[this.value] = true;
}).get();
selects.not(this).children().not(':selected').not(':first-child').each(function() {
this.disabled = vals[this.value];
});
});
});
于 2012-07-19T10:08:10.640 回答
0

这实际上是你想要的......这是基于 jquery 1.7 和 on() 事件绑定器

$(document).ready(function (){
      $('select').on('focus', function() {
        // on focus save the current selected element so you 
        // can place it back with all the other dropdowns
        var current_value = $(this).val();

        // bind the change event, with removes and adds elements
        // to the dropdown lists
        $(this).one('change.tmp', { v : current_value }, function(e)
        {
          if ($(this).val() != '')
          { // do not remove the Please select options
            $('option[value="' + $(this).val() + '"]')
              .not($('option[value="' + $(this).val() + '"]', $(this)))
              .remove();
          }

          if (e.data.v != '')
          { // do not add the Please select options
            $('select').not($(this)).append($('option[value="' + e.data.v + '"]', $(this)).clone());
          }
        });

        // on blur remove all the eventhandlers again, this is needed
        // else you don't know what the previously selected item was.
        $(this).on('blur.tmp', { v : current_value}, function (e)
        {
          $(this).off('blur.tmp');
          $(this).off('change.tmp');
        });
      });
    });

它唯一不做的就是以正确的顺序订购所有东西。您将不得不在 .append 函数中考虑自己的方法。

于 2012-07-13T12:35:09.703 回答