本文介绍了一个简单的登录页面实现方法，包括前端验证逻辑，确保用户输入有效的用户名和密码。使用JavaScript进行实时反馈，帮助用户及时修正错误输入。
<html> <head> <title>登陆界面</title> </head> <mce:script type="text/javascript"><!-- function CheckInput() { objName = document.getElementById("name"); if ( ("" == objName.value) || ('请输入用户名' == objName.value) ) { alert("请输入用户名!"); objName.focus(); return false; } objPwd = document.getElementById("pwd"); if ("" == objPwd.value) { alert("请输入密码!"); objPwd.focus(); return false; } return true; } function InputFocus(inputObj) { if (inputObj.value=="请输入用户名") { inputObj.value=""; } inputObj.style.color="#000"; } function InputBlur(inputObj) { if (inputObj.value=="") { inputObj.value="请输入用户名"; inputObj.style.color="#666"; } } // --></mce:script> <body> <form name="login" action="./login.php" method="post" onsubmit="return(CheckInput())"> <table> <tr> <td>用户名:</td> <td><input type="text" name="name" id = "name" onfocus="InputFocus(this);" onblur="InputBlur(this);" value="请输入用户名" style="color:#666;" mce_style="color:#666;"></td> </tr> <tr> <td>密 码:</td> <td><input type="password" name="pwd" id="pwd" value = ""></td> </tr> <tr> <td><input type="submit" name="submit" id="submit" value="提交"></td> <td><input type="reset" name="reset" id="reset" value="重置"></td> </tr> </table> </form> </body> </html>
扫一扫
879
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
