头像

php+Ajax远程加载避免重复提交

来源:http://www.sucaihuo.com/php/2747.html 素材火管理员 2017-08-16 21:17浏览(514) 收藏

更多Ajax实例教程:http://www.sucaihuo.com/php/124-0-0-0

php+ajax登录加载loading效果,一个提高用户体验,二个避免重复提交表单,ajax判断加载是否完成
php+Ajax远程加载避免重复提交
分类:PHP > Ajax 难易:初级

程序员,你不是一个人;网站开发QQ群:35291327,在线充值,或联系QQ416148489直接充值

查看演示 下载资源: 23 下载资源 下载积分: 80 积分

登录表单

<form onsubmit="return check_login()" style="text-align: center;margin-top:50px">
    <input value="登 录"   class="btn_submit" id="btn_submit" type="submit">
</form>

表单提交按钮和按钮失效样式

.btn_submit {
    background-color: #e31436;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 18px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    width: 200px;
    border-radius: 2px;
    border:none
}
.disabled{opacity: 0.5;cursor:default}

表单提交验证

function check_login() {
    if ($("#btn_submit").hasClass("disabled"));//避免重复提交
    return false;
    $("#btn_submit").addClass("disabled").val("正在提交");
    $.post("login.php", {id: 1}, function(data) {
        $("#btn_submit").removeClass("disabled").val("登 录");
        location.href = "http://www.sucaihuo.com/php/2747.html";
    }, "json");
    return false;
}
评论29
头像

友情提示:垃圾评论一律封号,下载出错或者资源有问题请联系全栈客服QQ 416148489

  • 头像 28楼
    14小时前 01:34
    111
    这是个好东西
  • 头像 27楼
    10-14 08:25
    IT-陈
    感谢分享,先用了
  • 头像 26楼
    10-13 10:41
    hsiwa
    感谢分享,先用了
  • 头像 25楼
    10-12 11:09
    75037997

    这是个好东西
  • 头像 24楼
    10-12 10:56
    75037997
    这是个好东西
  • 头像 23楼
    10-10 11:13
    张子逊
    这个还不错
  • 头像 22楼
    10-10 10:22
    张子逊
    这是个好东西
  • 头像 21楼
    10-07 23:14
    道真味道
    有没有朋友用过啊
  • 头像 20楼
    09-28 11:47
    piaoyudesi
    好东西,用的着
  • 头像 19楼
    09-27 23:39
    愛ツ伱才吻伱
    果断下载……
1 2