我正在寻找一个简单的解决方案来阻止登录表单提交空输入字段.表格的代码如下.如果可能的话,我想使用一个简单的
Javascript解决方案.
@H_403_2@<form id="login" method="post" action="">
<input type="text" name="email" id="email" />
<input type="password" name="pwd" id="pwd" />
<button type="submit" id="submit">Login</button>
</form>@H_404_3@
如果可能的话,我还想改变空场的边界.
提前致谢.
解决方法
带有虚拟检查的示例代码:
@H_403_2@<script type="text/javascript">
function checkForm(form) {
var mailCheck = checkMail(form.elements['email']),pwdCheck = checkPwd(form.elements['pwd']);
return mailCheck && pwdCheck;
}
function checkMail(input) {
var check = input.value.indexOf('@') >= 0;
input.style.borderColor = check ? 'black' : 'red';
return check;
}
function checkPwd(input) {
var check = input.value.length >= 5;
input.style.borderColor = check ? 'black' : 'red';
return check;
}
</script>
<style type="text/css">
#login input {
border: 2px solid black;
}
</style>
<form id="login" method="post" action="" onsubmit="return checkForm(this)">
<input type="text" name="email" id="email" onkeyup="checkMail(this)"/>
<input type="password" name="pwd" id="pwd" onkeyup="checkPwd(this)"/>
<button type="submit" id="submit">Login</button>
</form>@H_404_3@