一个简单的登录页面

一个简单的登录页面

工具：HBuilder

（1）首先导入jquery-3.4.1.js文件

（2）编写代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
		<script type="text/javascript">
			
			function check(){
				var user = $("#username").val();
				var pwd = $("#password").val();
				
				if(user==="zs" && pwd==="123"){
					alert("登录成功！");
				}else {
					alert("登录失败！")
				}
				
			}
			
		</script>
	</head>
	<body>
		
		<div align="center">
			账号：<input type="text" id="username" /> <br />
			密码：<input type="password" id="password" /> <br />
			<button onclick="check()">提交</button>
		</div>
		
	</body>
</html>

解析：

<script type="text/javascript" src="js/jquery-3.4.1.js"></script>

说明要引入jquery框架

onclick事件：点击鼠标会触发事件

关于== 和 === 的区别

==：会转换数据类型再比较（如果数据转换是合理的），例如123 == “123” 为真

===：必须是相同的类型比较并且值相等才为真，例如 123 === “123”为假，“123” === “234”为假，“123” === “123”才为真，123 === 123也为真。

（3）运行结果：

posted @ 2021-08-09 14:15  初中生林开心  阅读(298)  评论(0)    收藏  举报