javascript - 为什么我的js执行了两次？
本文介绍了javascript - 为什么我的js执行了两次？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
<script type="text/javascript" src="js/base64.min.js" ></script>
<script type="text/javascript" src="js/jquery-3.1.0.min.js" ></script>
<script type="text/javascript" src="js/json2.js" ></script>
<script src="js/mui.min.js"></script>
<style>
#username {
width: 260px;height: 45px;margin-left: auto;margin-right: auto;margin-top: 160px;
text-align: left;border: 1px solid gray;border-radius: 8px;line-height: 45px;
background-color: white;padding-left: 10px;
}
#password {
width: 260px;height: 45px;margin-left: auto;margin-right: auto;margin-top: 10px;
text-align: left;border: 1px solid gray;border-radius: 8px;line-height: 45px;
background-color: white;padding-left: 10px;
}
#BtnLogin {
width: 200px;height: 45px;margin-left: auto;margin-right: auto;margin-top: 10px;
text-align: center;border: 1px solid gray;border-radius: 8px;line-height: 45px;
color: white;background-color: dodgerblue;
}
#inputusername {
width: 180px;height: 30px;
}
#inputpassword {
width: 180px;height: 30px;
}
#findpassword {
float: left;color: darkgray;margin-left: 0px;margin-top: 10px;
}
#Register {
float: left;color: darkgray;margin-left: 160px;margin-top: 10px;
}
</style>
</head>
<body>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
</script>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">登录</h1>
</header>
<div id="Logincontent" style="width: 100%;">
<div id="loginregister" style=" margin-left: auto;margin-right: auto; width: 300px;height: 300px;">
<div id="username">账号：<input id="inputusername" placeholder="请输入手机号" /> </div>
<div id="password">密码：<input id="inputpassword" placeholder="请输入密码" /></div>
<div id="BtnLogin">登录</div>
<div id="findpassword">忘记密码</div>
<div id="Register">立即注册</div>
</div>
</div>
<script>
document.getElementById('BtnLogin').addEventListener('tap',function(){
console.log("ttt");
var username = document.getElementById('inputusername').value;
var passw = document.getElementById('inputpassword').value;
if(isNaN(username)){
alert("请输入正确的手机号");
}else if(username.length == 11){
if(passw != ''){
/*用户名密码已输入*/
var arr = {};
arr['key'] = "fdrewrdfsdfwerwe";
arr['name'] = username;
arr['password'] = passw;
var jarr = JSON.stringify(arr);
var base_arr = Base64.encode(jarr);
$.post("http://hdmd2016.com/index.php?g=Inter&m=Index",
{
method : "login",
params : base_arr
},
function(data,status){
var jdata = $.parseJSON(data);
var advarr = jdata.data;
if(advarr != null){
alert("登录成功");
}else{
alert("用户名或密码输入错误");
}
});
}else{
alert("请输入密码~");
}
}else{
alert("请输入正确的手机号");
}
});
</script>
</body>
</html>
当我输入错误的账号和密码的时候，alert("用户名或密码输入错误");会执行两次，
而且我用打印的时候，发现整个监听事件都被调用了一次，是什么原因？
解决方案
用.on()
这篇关于javascript - 为什么我的js执行了两次？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
