1

6つの選択タグがあります。

FIRST:値= 2、3、4、5で
選択します。SECOND&THIRST:selectには属性'disabled'がありません。FORTH
、FIFTH、SIXTH:selectには属性'disabled'があります。

私は欲しい:

if select value == 3-> FORTH remove attribute'disabled'
if select value == 4-> FORTH&FIFTH remove attribute'disabled'
if select value == 5-> FORTH&FIFTH&SIXTH remove attribute'disabled'
and else値を選択==2->FORTH、FIFTH、SIXTH:属性'disabled'を追加

これは私のスクリプトです

<select id="FIRST">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
  <option value="4">Four</option>
  <option value="5">Five</option>
</select>

<select id="SECOND">
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>

<select id="THIRST">
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>

<select id="FORTH" disabled>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>

<select id="SIXTH" disabled>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>

<select id="FIFTH" disabled>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
  <option value=" ">Something</option>
</select>


<script>
$(document).ready(function(){
    $('#FIRST').change(function(event) {
    if ($(this).val() == 3) {
        $('#FORTH').removeAttr('disabled');
    }
    else if $(this).val() == 4) {
        $('#FORTH, #FIFTH').removeAttr('disabled');
    }
    else if ($(this).val() == 5) {
        $('#FORTH, #FIFTH, #SIXTH').removeAttr('disabled');
    }
    else {
        $('#FORTH, #FIFTH, #SIXTH').attr('disabled');
    };
        });
});
 </script>

あれは正しいですか?それは実行されません

4

3 に答える 3

2

すでに述べたように、2つの構文エラーがあります。1つは最初else ifの行に、もう1つは最後から2番目の行にあり、閉じ括弧がありません。)

それはあなたが求めているものではありませんが、これは醜い非効率的なコードを避けるためにスイッチケースを使用する場合の完璧な例です。以下の例を参照してください。

$('#FIRST').change(function (event) {
    switch (+$(this).val())
    {
        case 3: $('#FORTH').prop('disabled', false); break;
        case 4: $('#FORTH, #FIFTH').prop('disabled', false); break;
        case 5: $('#FORTH, #FIFTH, #SIXTH').prop('disabled', false); break;
        default: $('#FORTH, #FIFTH, #SIXTH').prop('disabled', true); break;
    }
});

編集-また、マークアップで混乱する順序の問題があり、SIXTHとFIFTHが間違った方向に回っています。これを修正し(そしてTHIRSTをTHIRDに名前変更しました)、上記のコードの動作デモがこの修正されたマークアップで動作するのを見ることができますJSFiddle

Derek Hendersonからのコメントで説明されていることを実現するために、上記のコードを次のように更新できます。

$('#FIRST').change(function (event) {
    switch (+$(this).val())
    {
        case 3: $('#FORTH').prop('disabled', false); $('#FIFTH, #SIXTH').prop('disabled', true); break;
        case 4: $('#FORTH, #FIFTH').prop('disabled', false); $('#SIXTH').prop('disabled', true); break;
        case 5: $('#FORTH, #FIFTH, #SIXTH').prop('disabled', false); break;
        default: $('#FORTH, #FIFTH, #SIXTH').prop('disabled', true); break;
    }
});

そして、これがJSFiddleでの作業の例です。

于 2013-03-08T15:57:21.293 に答える
1

コードに2つの構文エラーがあり、ハンドラー})を閉じるためとステートメントの1つが欠落しています。change(else if

$(document).ready(function(){
    $('#FIRST').change(function(event) {
       if ($(this).val() == 3) {
           $('#FORTH').prop('disabled', false);
       }
       else if ($(this).val() == 4) { // here
           $('#FORTH, #FIFTH').prop('disabled', false);
       }
       else if ($(this).val() == 5) {
           $('#FORTH, #FIFTH, #SIXTH').prop('disabled', false);
       }
       else {
           $('#FORTH, #FIFTH, #SIXTH').prop('disabled', true);
       }
   }) // and here
});
于 2013-03-08T15:48:59.613 に答える
0

(。変更:

 else if $(this).val() == 4) {
    $('#FORTH, #FIFTH').prop('disabled', false);
}

 else if ($(this).val() == 4) {
    $('#FORTH, #FIFTH').prop('disabled', false);
}
于 2013-03-08T15:49:41.050 に答える