jQuery练习----表单验证之必需字段不能为空
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>表单验证之必需字段不能为空</title>
<style type="text/css">
.label {float:left; width:120px;}
.infobox {width: 200px; }
.error {color:red; padding-left: 10px;}
.submit {margin-left: 125px; margin-top: 10px; }
</style>
<script src="../jquery-1.5.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.error').hide();
$('.submit').click(function(event) {
var data = $('.infobox').val();
var len = data.length;
if(len<1) {
$('.error').show();
event.preventDefault();
}
else {
$('.error').hide();
}
});
});
</script>
<body>
<form id="signup" method="post" action="">
<div>
<span class="label">User Id *</span>
<input type="text" class="infobox" name="userid" />
<span class="error">This field cannot be blank</span>
</div>
<input class="submit" type="submit" value="submit" />
</form>
</body>
</html>
