编写一个简单的登录界面
<html>
<head>
<title>JSP - Hello World</title>
</head>
<body background="imagine/鸡哥头.jpg" style="background-repeat:no-repeat;background-attachment:fixed;background-size:100% 100%">
<div style="text-align: center">
<h1> 登录界面</h1><br>
<form method="post" id="login" action="success.html">
账号<input type="text" name="nameid" id="nameid"><br>
密码<input type="password" name="pwd" id="pwd"><br>
<span id="msg" style="font-size: 12px;color:red"></span><br>
<button type="button" id="btm">登录</button>
</form>
<script>
document.getElementById("btm").addEventListener("click", function(){
var a=confirm("确认登录嘛？");
if(!a)
{
document.getElementById('msg').innerHTML="您已取消登录";
return;
}
var id=document.getElementById("nameid").value;
var pwd=document.getElementById("pwd").value;
if(!is(id))
{
document.getElementById('msg').innerHTML="您的账号不能为空";
return;
}
if(!is(pwd))
{
document.getElementById('msg').innerHTML="您的密码不能为空";
return;
}
document.getElementById('login').submit();
});
function is(s)
{
if (s.length==0||s.trim()=="")
return false;
else return true;
}
</script>
</div>
</body>
</html>
登录时会跳出弹窗问是否确认登录
登录前会验证账号和密码是否为空，空的话会给出提示
标签：01,return,17,登录,innerHTML,2024,getElementById,var,document From： https://www.cnblogs.com/zhenaifen/p/17969859