我对你的代码做了一些修改,你可以看到 here . 一开始它对我的工作也不起作用,但现在它起作用了,我想,正如预期的那样。如果你有问题,就说:)

我们开始吧:

重新申报 $selects

select.next('button').click(function(event) {
        event.preventDefault();

        select.remove();
       $(this).remove();
       $selects = $('select');  // <-- redeclare selects here, one is gone!
});

nth-child 而不是 eq . 前者将全选 option 这就是 i 情商 将只选择 第n个孩子

// Remove them from this dropdown
$.each(selectedIndexes, function(i, index) {

  // use n-th child here to get the child of each select.
  // eq only selects the element from the matched set
  $thisSelect.find('option:nth-child('+(index+1)+')').attr("disabled","disabled");

});

我相信您需要为此函数添加代码,以便从选定值的数组中删除相关值:

select.next('button').click(function(event) {
        event.preventDefault();

        select.remove();
       $(this).remove();

  });

或者,可以添加一个数组来跟踪在删除时在要删除的下拉列表中选择的值,然后从另一个函数中排除这些值,在该函数中灰显所使用的值。

demo

var $selects = $('select'); .

是的,你移除了 select var $selects .

这将修复它。。。

   select.remove();
   $(this).remove();
   $selects = $selects.not(select);

这样地,

   $(this).remove();
   $selects = $selects.not(select.remove());

好吧,我要指出的是,正如其他答案一样,你需要“回忆”你的生活 $select 变量以包含最新的项。但是,你的脚本对我来说失败了,所以我采取了不同的方法。下面是我的代码。你可以 also demo it here is available here

var $selects = $('select');

$selects
  .after('<button>remove</button><br /><br />')
  .each(function(i, el) {
    $(this)
      .next()
      .click(function(e) {
        e.preventDefault();

        $(el).remove();
        $(this).remove();

        $selects = $('select');
        $selects.change(); 
      });
    })
  .change( function() {
    $selects
      .children().removeAttr("disabled").end()
      .each(function(i, el){
        $selects
          .not(this)
          .find(':selected')
          .each(function(){ 
            $(el).find('option')
                 .eq($(this).index())
                 .attr('disabled', true);
          });                                                             
      });
    })
  .change();

即使移除了select元素 $selects 数组包含对它的引用。我改了 $selects.each 功能:

$selects.each(function() {
        var select = $(this);
        select.next('button').click(function(event) {
        event.preventDefault();

        $selects=$selects.not(select);//ADDED THIS LINE

        select.remove();
        $(this).remove();
    });
});