サマリー：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css">
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
div{width: 500px;height: 500px;border: 1px solid pink;margin: 0px auto;}
</style>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var c=5;
$("#input2").click(function(){
var a =$("#input1").val();
var b =$("#input3").val();
if(c<0)
{return;}
document.write(a+b);
if(a=="滅絕" || b=="123"){
alert("密碼正確");
}else{
c--;
alert("密碼錯(cuò)誤，你還有"+c+"次機(jī)會(huì)重新輸入");
}
})
$(".input").blur(function(){
$('#input1').css('background','pink');
})
$(".input").focus(function(){
$(".input").css('background','blue'); })
$("#input2").mouseover(function(){
$("#input2").css('background','pink');
})
$("#input2").mouseleave(function(){
$("#input2").css('background','blue');
})
$(".input").change(function(){
$(".input").css('width','100px');
})
})
</script>
</head>
<body>
<div>
賬號(hào)：
<input type="text" id="input1" placeholder="請(qǐng)輸入賬號(hào)" ><br>
密碼：
<input type="text" id="input3" placeholder="請(qǐng)輸入密碼">
<br>
<input type="button" id="input2" value="登陸">
</div>
</body>
</html>