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 回答