0

3〜10個のテキスト入力項目が必要なフォームがあります。フォームが最初に読み込まれると、3つの入力（最小）が表示されます。

前の行には有効な値があるため、入力行を効率的に表示したいと思います（たとえば、3文字を超えると仮定します）。したがって、最初の3つに入力すると、4番目のオプションの入力行が自動的に表示されます。

jQueryでこのクイックリストを効率的にループするのを手伝ってもらえますか？

HTML：

<input type="text" class="item_1" name="item_1">
<input type="text" class="item_2" name="item_2">
<input type="text" class="item_3" name="item_3">
<input type="text" class="item_4" name="item_4">
<input type="text" class="item_5" name="item_5">
<input type="text" class="item_6" name="item_6">
<input type="text" class="item_7" name="item_7">
<input type="text" class="item_8" name="item_8">
<input type="text" class="item_9" name="item_9">
<input type="text" class="item_10" name="item_10">

CSS：

.item_4,.item_5,.item_6,.item_7,.item_8,.item_9,.item_10 { display:none }
4

1 に答える 1

2

これは非常に単純です。jQuery の連鎖に任せれば、ループさえ必要ないはずです。私は次のようなことをします：

$("#myform input").change(function(){ //If an input in your form is changed,
    if ($(this).val() == 42){ //replace with your validation logic :)
         $(this).next('input').show(); //This shows the next sibling element to the triggering element
    } else { //but if it fails validation...
         $(this).nextAll('input').hide().val(""); //hide them and delete the contents to stop the form from uploading invalidated data!
    }
});

これはあなたが求めたことを行い、ボーナスポイントについては、前のボックスが後で無効に変更された場合に、後のボックスを非表示にして空にします。

于 2012-08-08T20:20:51.540 に答える