手机网站form表单check神器——Validform(2)-阿里云开发者社区

开发者社区> 沉默王二> 正文

手机网站form表单check神器——Validform(2)

简介: 手机网站form表单check神器——Validform
+关注继续查看

4. config配合ajaxpost可以使得一个ajax请求未结束时不再提交请求到服务端


我们可以先把下面这行代码注释掉,再来看一个form的运行方式,这样会更清晰


$.Tipmsg.p = null;// 通过验证的信息取消显示


第一次点击submit的时候,页面上提示“正在提交数据”

image.png



之后,服务端把处理信息返回到页面上。


image.png


假设服务端返回的信息返回的更慢一点,这时候我们不希望再次点击submit的信息再提交到服务端。

有了config配合ajaxpost的设置之后,当一个ajax请求未结束时,点击submit会提示“正在提交数据”


5. Validform是如何处理4的呢?


这是因为Validform为form表单设置了三种状态,分别是:


normal:未提交,posting:正在提交,posted:已成功提交过。

当点击submit提交数据(必须是ajaxpost请求的状态下)的时候,Validform的form状态改为posting,如果ajax返回success时,Validform的form状态改为posted,如果ajax返回error时,Validform的form状态改为normal。

//表单正在提交时点击提交按钮不做反应;
if(curform[0].validform_status==="posting"){return false;}

var beforeSubmit=settings.beforeSubmit && settings.beforeSubmit(curform);
if(beforeSubmit===false){return false;}

// ajax 提交之前设置为posting
curform[0].validform_status="posting";

// ajaxPost参数必须是true 
if(settings.ajaxPost || ajaxPost==="ajaxPost"){

// 提示“数据提交中”
Validform.util.showmsg.call(curform,curform.data("tipmsg").p||tipmsg.p,settings.tiptype,{obj:curform,type:1,sweep:settings.tipSweep},"byajax");

    if(ajaxsetup.success){
        var temp_suc=ajaxsetup.success;
        ajaxsetup.success=function(data){
            settings.callback && settings.callback(data);
            curform[0].validform_ajax=null;
            if($.trim(data.status)==="y"){
                // 设置为posted
                curform[0].validform_status="posted";
            }else{
                curform[0].validform_status="normal";
            }

            temp_suc(data,curform);
        }
    }

    if(ajaxsetup.error){
        var temp_err=ajaxsetup.error;
        ajaxsetup.error=function(data){
            settings.callback && settings.callback(data);
            // 设置normal
            curform[0].validform_status="normal";
            curform[0].validform_ajax=null;

            temp_err(data,curform);
        }   
    }

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
10026 0
使用SSH远程登录阿里云ECS服务器
远程连接服务器以及配置环境
2502 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,阿里云优惠总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系.
13841 0
windows server 2008阿里云ECS服务器安全设置
最近我们Sinesafe安全公司在为客户使用阿里云ecs服务器做安全的过程中,发现服务器基础安全性都没有做。为了为站长们提供更加有效的安全基础解决方案,我们Sinesafe将对阿里云服务器win2008 系统进行基础安全部署实战过程! 比较重要的几部分 1.
9154 0
阿里云服务器ECS登录用户名是什么?系统不同默认账号也不同
阿里云服务器Windows系统默认用户名administrator,Linux镜像服务器用户名root
4492 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
7347 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,云吞铺子总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系统盘、创建快照、配置安全组等操作如何登录ECS云服务器控制台? 1、先登录到阿里云ECS服务器控制台 2、点击顶部的“控制台” 3、通过左侧栏,切换到“云服务器ECS”即可,如下图所示 通过ECS控制台的远程连接来登录到云服务器 阿里云ECS云服务器自带远程连接功能,使用该功能可以登录到云服务器,简单且方便,如下图:点击“远程连接”,第一次连接会自动生成6位数字密码,输入密码即可登录到云服务器上。
22366 0
+关注
沉默王二
微信搜索「沉默王二」,回复关键字「00」获取硬核计算机基础资料。
1084
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载