2

Web アプリケーションに、同じ値を含む 2 つの同じドロップダウン リストがあります。実際には、これらのドロップダウン リストは口座番号用です。
これらのリストから 2 つの同じアイテムを選択することは避けたいです。
たとえば、ユーザーが最初のドロップダウン リストから項目 #1 を選択した場合、項目 #1 は 2 番目の項目から非表示にする必要があります (この項目が最初の項目でない場合は、インデックス #0)。また、ユーザーが選択した項目を #2 に変更した場合、2 番目のドロップダウンの #1 が表示される必要があります。

私は何かを書きましたが、うまくいきません：

$('#d1').change(function(e) {
    index = $(this).prop('selectedIndex');
    if (index != 0) $('#d2 option:eq(' + index + ')').css('display','none');
});

ここを見てください。

選択したアイテムを非表示にする前に、すべてのアイテムを表示する方法が必要だと思います。

4

3 に答える 3

3

使用する.siblings()

$('#d1').change(function(e) {
    index = $(this).prop('selectedIndex');
  $('#d2 option:eq(' + index + ')').css('display','none').siblings().css('display','block');
});

​

ここにデモがありますhttp://jsfiddle.net/QTDXt/10/

于 2012-12-18T14:43:44.600 に答える
2

特定のオプションを非表示にできない場合があります。(Chrome ではできません。) 代わりに、オプションを無効にしてみてください。

$('#d1').change(function(e) {
    index = this.selectedIndex;
    $('#d2 option').prop('disabled', false); // enable all options
    if (index != 0) {
        $('#d2').get(0).selectedIndex = 0; // so you don't disable the option after it's selected
        $('#d2 option:eq(' + index + ')').prop('disabled', true);
    }
});​

http://jsfiddle.net/mblase75/QTDXt/6/

于 2012-12-18T14:43:47.643 に答える
1 
$('#d1').change(function(e) {
index = $(this).prop('selectedIndex');
if (index != 0) {
  $('#d2 option:eq(' + index + ')').css('display','none');}
  $('#d2 option:eq(' + index + ')').siblings().css('display','block');
});

フィドル

于 2012-12-18T14:49:02.143 に答える