1

私のアプリケーションには<select>、まったく同じオプションのリストを表示する複数のドロップダウンがあります。これらのドロップダウンのいずれかからアイテムを選択すると、選択したアイテムが他のドロップダウンから削除されます。JavaScriptでこれを達成するにはどうすればよいですか?

4

3 に答える 3

1

要素の value 属性を特定し、次にすべての select 要素を反復処理し、すべての内容を反復処理して同一の value 属性値を持つものを見つけ、最後に次を使用してオプションを削除します。

option.parentElement.removeChild(option);

または、jQuery を使用することもできます。

$(document).on('change','select',function(){
    $(this).addClass('exception');
    $('option[value="' + this.value + '"]:not(.exception *)').remove();
    $(this).removeClass('exception');
});

http://jsfiddle.net/PCvT4/

これは同じことを達成します。ここで予測できる問題は、いくつか選択した後にオプションが不足することです。次のように、オプションを無効にしてみてください。

$(document).on('change','select',function(){
    $('option[value="disabled"]').prop('disabled',false);
    $(this).addClass('exception');
    $('option[value="' + this.value + '"]:not(.exception *)').prop('disabled',true);
    $(this).removeClass('exception');
});

http://jsfiddle.net/ZrsC6/

于 2012-11-02T13:44:52.960 に答える
0

これを試して：

$(document).ready(function() {
    $("select").change(function() {
        var self=this;

        $("select").each(function() {
            if (this===self) {
                return;
            }

            $(this).prop('selectedIndex',0);
        });
    });
});​

働くフィドル

于 2012-11-02T13:47:18.960 に答える