在span标签提示 请输入用户名和密码
ç¨jqueryå§ãå ·ä½åèä¸ä¸é¢ç代ç ã
HTMLçform
<form class="form form-horizontal" action="index.html" method="post"><div class="row cl">
<label class="form-label col-xs-3"><i class="Hui-iconfont"></i></label>
<div class="formControls col-xs-8">
<input id="username" type="text" placeholder="è´¦æ·" class="input-text size-L">
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-3"><i class="Hui-iconfont"></i></label>
<div class="formControls col-xs-8">
<input id="password" type="password" placeholder="å¯ç " class="input-text size-L">
</div>
</div>
<div class="row cl">
<div class="formControls col-xs-8 col-xs-offset-3">
<label for="online">
<input type="checkbox" name="online" id="online" value="">
使æä¿æç»å½ç¶æ</label>
</div>
</div>
<div class="row cl">
<div class="formControls col-xs-8 col-xs-offset-3">
<input id="loginBtn" type="button" class="btn btn-success radius size-L" value=" ç» å½ ">
<input name="" type="reset" class="btn btn-default radius size-L" value=" å æ¶ ">
<p id="loginTip" style="color: red;"></p>
</div>
</div>
</form>
JAVASCRIPT
$(document).ready(function(){
//å¤æå½åæ¯å¦æç¨æ·ç»é
$.post("./mockJson/judgeLogin.json",function(data){
if(data.returnCode==0){
//跳转é¦é¡µ
location.href="A_index.html";
}else{
//ç»å®loginBtnäºä»¶
$("#loginBtn").click(userLogin);
}
});
});
function userLogin(){
var username = $("#username").val();
var password = $("#password").val();
var tipMsg = $("#loginTip");
if(username!="" && username!=null && password!="" && password!=null){
$.post("./mockJson/toLogin.json",{
userName:username,
passWord:password
},function(data){
if(data.returnCode==0){
location.href="A_index.html";
}else{
tipMsg.text(data.returnMsg);
}
});
}else{
tipMsg.text("请填åå®æ´åæ交ç»é");
}
}
</script>追é®
judgeLogin.json å toLogin.jsonå¢ï¼
æç¹å¤æè½ä¸è½åJavaScriptç
è¿ä¸¤ä¸ªæ¯æ¶åå°ä¸æå¡å¨äº¤äºçï¼å¯ä»¥ä¸ç¨ç®¡ã
主è¦å°±æ¯ ä½ å¨ç»éæ¡ä¸å 个è¿ä¸ªï¼
<p id="loginTip" style="color: red;"></p>
ç¶åjavascriptè¿æ ·åï¼
${document}.ready(function(){//loginBtnæ¯æ交BUTTONçæé®ID
$("#loginBtn").click(userLogin);
);
function userLogin(){
//var username = $("#username").val();
//var password = $("#password").val();
var tipMsg = $("#loginTip");
if(username!="" && username!=null && password!="" && password!=null{
//åéç»é请æ±
}else{
tipMsg.text("请填åå®æ´åæ交ç»é");
}
使ç¨éè¦å¯¼å ¥jqueryå ã
温馨提示:答案为网友推荐,仅供参考