Question

我有3个多重选择，如：

<select multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
</select>

<select multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
</select>

<select multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
</select>

我正在寻找最佳解决方案。通缉行为是指您在一个多选中选择一个项目，然后将其从其他项目中删除（反之）。

我使用jquery Chosen插件。情况：您有3个角色，但用户可以只担任一个角色。

jsFiddle

Answer 1

基本上你想通过JS / jQuery删除选项并更新插件。

这是一些代码

  $(".chzn-select").change(function(){   
    $(".chzn-select")   
    .not($(this))  
    .find("option[value="+$(this).val()+"]")   
    .remove();   
    $(".chzn-select").trigger("liszt:updated");   
   });

和小提琴链接JsFiddle

编辑：尝试这个新的小提琴它处理多个选择

$(".chzn-select").css('width', '300px').chosen({
        display_selected_options: false,
        no_results_text: 'not found',
    }).change(function(){
        var me = $(this);
        $(".chzn-container .search-choice").each(function(){
            var text = $('span',this).text();
            $(".chzn-select")
            .not(me)
            .find("option").each(function(){
               if ($(this).text() == text) $(this).prop('disabled',true);
            });
        });
        $(".chzn-select").trigger("liszt:updated");
});

<强>编辑：
试试这个： JsFiddle
看看它是否让你高兴... :)

从“多选”中选择一个选项时，将其从其他选项中删除（和反向）

1 个答案: