与jquery动态下拉

我有一个页面，显示页面上的3个下拉选择器。我还有一个jQuery代码，用于检查以确保如果选择了一个选项，则不允许在另外两个下拉列表中选择同一个选项。与jquery动态下拉

我需要更改代码不仅仅是允许选择一个副本，而是从这个下面的其他下拉列表中完全删除选定的选项。我假设我将不得不将所有选项放入数组中，并在生成下一个下拉列表时从列表中删除。

或者我需要用不同的颜色标记已经选定的颜色，也许还有一个类。

这里是我当前的代码：

$('.mySelect').change(function(index, elem){ 
    var myFilter = $(this).val(); 
    if(myFilter !="selectOne"){ 
     var size = $('.qSelect').not(this).not(function(index){ 
     return $(this).val() != myFilter; 
    }).size(); 
     if(size > 0){ 
      alert("already selected."); 
     } else { 
      // do something 
     } 
    } 
}); 

<select name="select1" class="mySelect"> 
    <option value="selectOne">Select one</option> 
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option> 
    <option value="3">Option 3</option> 
</select> 

<select name="select2" class="mySelect"> 
    <option value="selectOne">Select one</option> 
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option> 
    <option value="3">Option 3</option> 
</select> 

<select name="select3" class="mySelect"> 
    <option value="selectOne">Select one</option> 
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option> 
    <option value="3">Option 3</option> 
</select>

来源

2011-02-16 santa

您可以使用适当的表单字段行为并将该选项设置为“禁用”，而不是创建数组并删除/重新插入项目。如果您删除元素，用户可能会感到困惑。

您可以通过去做到这一点：

$('.mySelect').bind('change', function(el) { 

    var _this = $(this), 
     newVal = _this.val(); 
    $('select.mySelect:not([name=' + _this.attr('name') + ']) 
      option[value=' + _this.data('oldVal') + ']').attr('disabled', false); 
    $('select.mySelect:not([name=' + _this.attr('name') + ']) 
      option[value=' + newVal + ']').attr('disabled', true); 
    _this.data('oldVal', newVal); 

});

（http://jsfiddle.net/KT856/）

可以更改 “.attr（ '残疾人'，真）” 申请你决定什么都处理。

而且 - 我假设你在服务器端验证这个问题，以及;）

编辑：更新后的脚本，以便它以重新启用在其他选择这些选项存储“以前的选择，”如果选择变化。

注意：无论用户选择何种顺序，此方法都可以使用。

来源

2011-02-16 14:15:46

你是对的 - 删除选项会令人困惑。你的解决方案接近我的想法 - 改变颜色，除非它更好，因为它禁用了选项。非常好。此外，任何提供jsfiddle链接的人都会从我那里获得+1，只是为了加倍努力！谢谢一堆。 – santa 2011-02-16 15:52:42

关于使用jQuery的remove function与attribute-equals-selector相结合呢？于是就改变穿过其他下拉菜单和删除选项，这样

option[value=myFilter]

顺便说一句。如果用户先从第三个下拉列表中选择，会发生什么？

来源

2011-02-16 13:26:25 Timon

是的，这是用户更改订单的可能性。然后代码需要删除已经使用的代码。不过，我倾向于改变选定的选项的颜色，除了像现在这样有警惕之外。但我确实需要一个选定的列表来标记，对吗？也许我可以在我的当前函数下创建一个数组。我将如何使用jQuery来做到这一点？ – santa 2011-02-16 13:32:02

与jquery动态下拉

回答

相关问题