您的位置:首页 > 其它

使用window.setInterval设置登录前…

2014-06-05 16:05 211 查看
假如有一个登录表单代码如下:

<div><span>用户</span><input
id="username" type="text" name="username" value=""
/></div>

<div><span>密码</span><input
id="password" type="password" name="password" value=""
/></div>
<div><input
type="button" value="登录" /><input
type="button" value="重置"
/></div>
<div
id=”loading”></div>

需要在点击“登录”按钮时,出现”Load… …”效果。
假如jquery的js引用后,使用$post请求时作出处理。
发送ajax请求的代码:
$(“.input_login”).click(function(){
var username = $.trim($(“#username”).val());
var password = $.trim($(“#password”).val());
if(username==null || username==”"){
alert(“请输入用户名!”);
$(“#username”).focus();
return;
}
if(password==null || password==”"){
alert(“请输入密码!”);
$(“#password”).focus();
return;
}

$(“#loading”).html(“<strong>Loading<span
id=\”interval\”></span></strong>”);
window.setInterval(loading, 300);
$.post(“login” ,
{“username” : username ,
“password” : password} ,
function(data){
$(“#loading”).empty();
if(data.value == true){
var path = $(“base”).attr(“href”);
location.replace(path+”home/index”);
}else{
alert(“用户名或密码错误”);
$(“.input_reset”).click();
}
},’json’);
});
$(document).keydown(function(event){
if(event.keyCode == 13){
$(“.input_login”).click();
}
});
});
出现Loading后面的…的循环方法:
function loading(){
var temp = $(“#interval”).text();
if(temp.length<6){
$(“#interval”).text(temp+”.”);
}else{
$(“#interval”).text(“”);
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐