我尝试编写一个 jquery 表单检查代码,如果值为空/单词长度小于某个值,则取消绑定提交单击,在某些 div 中显示错误提示。然后5秒后,绑定提交点击。jsfiddle 中的代码,但绑定/取消绑定不能按我的意愿工作。
JS:
$('#submit').click(function(){
if($('#title').val().length<10){
$('#statue').append('You should type more than 10 words');
$('#submit').unbind("click");
setTimeout(function (){
$("#statue").html("");
$('#submit').bind("click");
}, 5000);
}
if($('#content').val().length<20){
$('#statue').append('You should type more than 20 words');
$('#submit').unbind("click");
setTimeout(function (){
$("#statue").html("");
$('#submit').bind("click");
}, 5000);
}
if(!$('#type').val()){
$('#statue').append('You should select one type.');
$('#submit').unbind("click");
setTimeout(function (){
$("#statue").html("");
$('#submit').bind("click");
}, 5000);
}
});
HTML:
<form method="post" action="porcess.php">
<input id="title" name="title" type="text" />
<textarea name="content" id="content" cols="40" rows="2"></textarea>
<select name="type" id="type" size="5">
<option value="a">Section A</option>
<option value="b">Section B</option>
<option value="c">Section C</option>
<option value="d">Section D</option>
<option value="e">Section E</option>
</select>
<input type="submit" name="submit" id="submit" value="submit" />
</form>
<div id="statue"></div>