禁用项目更改上一个选择框中的相同项目

Question

我有两个选择组合框，其中包含相同的项目。

我想要做的是当我从第一个组合框中选择任何项目时，应该在第二个组合框中禁用具有相同值的项目。

这是我想要的图像：

我用过的库是：http://dropdown-check-list.googlecode.com/svn/trunk/doc/dropdownchecklist.html

我尝试的代码是：

       $("#select_first").dropdownchecklist({maxDropHeight: 150,
                onComplete: function(selector) {
                    var values = "";
                    for( i=0; i < selector.options.length; i++ ) {
                        if (selector.options[i].selected && (selector.options[i].value != "")) {
                            $("#select_second").children('option').each(function() {
                                if ( $(this).val() === selector.options[i].value ) {
                                    $(this).attr('disabled', true).siblings().removeAttr('disabled');
                                }
                            });
                        }
                    }
                }
            });

同样的问题是Here 请在此添加解决方案。

如果有，请提供解决方案。 非常感谢。

Answer 1

参考这个。 我从这里解决了......希望这对你也有帮助...... http://dropdown-check-list.googlecode.com/svn/trunk/doc/dropdownchecklist.html

Answer 2

根据您的代码，您将禁用＆lt;选项＆gt; ，但需要刷新第二个控件以包含更新的属性属性。

$("#s2").dropdownchecklist("refresh");

因此，在对控件进行任何更改后，必须刷新它才能使其正常工作。

Demo

Answer 3

检查出来|的 DEMO

HTML

<select id="select1" onchange="fix(this,'select2')">
    <option>Select one</option>
    <option>First value</option>
    <option>Second Value</option>
    <option>Third Value</option>
</select>

<select id="select2" onchange="fix(this,'select1')">
    <option> - Select one</option>
    <option>First value</option>
    <option>Second Value</option>
    <option>Third Value</option>
</select>
<br><br>
<input type="checkbox" value="1" onclick="set(this)">value1 <input type="checkbox" value="1" onclick="set(this)">value1<br>
<input type="checkbox" value="2" onclick="set(this)">value2 <input type="checkbox" value="2" onclick="set(this)">value2<br>
<input type="checkbox" value="3" onclick="set(this)">value3 <input type="checkbox" value="3" onclick="set(this)">value3<br>
<input type="checkbox" value="4" onclick="set(this)">value4 <input type="checkbox" value="4" onclick="set(this)">value4<br>

JAVASCRIPT

function fix(dis,elem)
{
    var value = dis.options[dis.selectedIndex].text;  

    var ele = document.getElementById(elem);
    for(var i=0;i<ele.options.length;i++)
    {
        if(ele.options[i].text == value)
        {
            ele.options[i].style.display="none";
        }
        else
        ele.options[i].style.display="block";
    }

}
function set(dis)
{
     var ele = document.getElementsByTagName('input');
    for(var i=0;i<ele.length;i++)
    {
        if(ele[i].getAttribute('type')=='checkbox')
        {
             if(ele[i].value == dis.value)
             {
                 if(ele[i].disabled)
                     ele[i].disabled = false;
                 else
                  ele[i].disabled = true;   
             }

        }
    }
    dis.disabled = false;
}