私がやりたいことは次のとおりです:最初に、関数validate()
はすべての入力を1つずつチェックする必要があります。入力が空でない(または空白である)場合は、ifステートメントに移動します(ラジオボタンをチェックするため)。入力が空の場合、検証関数全体を停止し、空の入力に焦点を合わせます。
これが結果です: http://jsfiddle.net/tt13/y53tv/4/
ok
ボタンを押すだけで、最初の機能が終了し、実行された場合に起動することがわかります。しかし、each()関数だけでなく、空のフィールドがある場合は、validate()関数全体を終了したい
[〜#〜] js [〜#〜]
function validate() {
$('.var_txt').each(function() {
if ($.trim($(this).val()) == '') {
$(this).focus();
return false;
}
});
if (!$(".answer:checked").val()) {
alert("boom");
return false;
}
return true;
}
$(document).ready(function() {
$("#add_question").submit(function(e) {
if (validate()) {
alert("good");
}
e.preventDefault();
})
});
HTMLマークアップ
<form id="add_question" method="post" action="">
<table>
<tr>
<td class="var_label">
<input class="answer" type="radio" name="answer" value="a" /> a)
</td>
<td>
<input type="text" class="var_txt" name="var_a" />
</td>
</tr>
<tr>
<td class="var_label">
<input class="answer" type="radio" name="answer" value="b" /> b)
</td>
<td>
<input type="text" class="var_txt" name="var_b" />
</td>
</tr>
<tr>
<td class="var_label">
<input class="answer" type="radio" name="answer" value="c" /> c)
</td>
<td>
<input type="text" class="var_txt" name="var_c" />
</td>
</tr>
<tr>
<td class="var_label">
<input class="answer" type="radio" name="answer" value="d" /> d)
</td>
<td>
<input type="text" class="var_txt" name="var_d" />
</td>
</tr>
<tr>
<td class="var_label">
<input class="answer" type="radio" name="answer" value="e" /> e)
</td>
<td>
<input type="text" class="var_txt" name="var_e" />
</td>
</tr>
</table>
<input type="submit" name="submit" value="ok" />
</form>
続行するにはfalseでなければならないフラグを追加します。
function validate() {
var invalid = false;
$('.var_txt').each(function() {
if ($.trim($(this).val()) == '') {
$(this).focus();
invalid = true;
return false;
}
});
if (invalid) {
return false;
}
if (!$(".answer:checked").val()) {
alert("boom");
return false;
}
return true;
}
$(document).ready(function() {
$("#add_question").submit(function(e) {
if (validate()) {
alert("good");
}
e.preventDefault();
})
});
コールバック関数をfalseに戻すことにより、特定の反復で$ .each()ループを中断できます。 false以外を返すことは、forループのcontinueステートメントと同じです。すぐにスキップして次の反復に進みます。
検証の最初にフラグを設定します:_var broken = false;
_。 each
内の_return false;
_の直前に_broken = true;
_を追加します。次に、each
コードの後にif( broken) return false;
を追加します
あれ?
function validate() {
var pass = true;
$('.var_txt').each(function() {
if ($.trim($(this).val()) == '') {
$(this).focus();
pass = false;
return false;
}
});
if (!$(".answer:checked").val()) {
alert("boom");
pass = false;
return false;
}
return pass;
}
条件が真かどうかをチェックする変数を追加します。