©2020-2024 ioDraw All rights reserved
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport"
content="width=device-width, initial-scale=1"> <title></title> </head> <body>
<div> <span>用户名:</span> <input type="text" placeholder="请输入用户名..."
id="username"> <span>密码:</span> <input type="password" placeholder="请输入用户名..."
id="passwd"> <input type="button" value="登录" onclick="login()"> <input
type="button" id="btnClear" value="清除" onclick="doClear()" /> </div> <script
type="text/javascript"> let accountAll = [{ // 存储账户json数据的数组 username: 123,
passwd: 'qwe' }, { username: 456, passwd: 'asd' }, { username: 789, passwd:
'zxc' } ] function login() { //登陆判断 let username =
document.getElementById('username').value; let passwd =
document.getElementById('passwd').value; let account =
accountAll.filter(function(e) { return e.username == username })[0]; //
筛选账号返回数组，不存在则返回空数组 if (!account) { alert('账户不存在'); } else { if
(account.username == username && account.passwd == passwd) { alert('登陆成功'); }
else { alert('密码错误'); } } } function doClear() {
//获取页面所有的input框，是text和password框，内容=空串 let inputs =
document.getElementsByTagName("input"); for (let i = 0; i < inputs.length; i++)
{ if (inputs[i].type == 'text' || inputs[i].type == 'password') {
inputs[i].value = ''; } } } //给清除按钮增加onclick事件 let btnClear =
document.getElementById('btnClear'); btnClear.addEventListener('click',
function() { doClear(); }); </script> </body> </html>