表单提交时要点击两次按钮（Validform验证）才能成功的解决方法

原因分析：
因为表单控件中含有ajax验证，所以在点击提交按钮时，会先执行submit，但由于此时含有ajax验证的控件还未执行验证，所以并未提交成功，然后再执行控件的blur事件对控件内容进行验证，如果验证通过，那么此时再点击一次提交按钮就会提交成功。

解决方法：
修改验证的触发事件，Validform默认的验证触发事件是blur，可以修改为在触发keyup事件时进行验证，在用户输入时即时验证，那么在点击提交按钮时就可以不用再次验证，这时就可以直接提交成功。
如下：

修改前：

html:
<div class="valGroup"><div class="valGroup-item-1 inline-block"><span>*span> 短信验证码：div><div class="valGroup-item-2 formControls inline-block"><asp:TextBox ID="txtTelCode" runat="server" CssClass="input-text-1" Width="200px" datatype="n6" ajaxurl="/tools/validreg.ashx?regType=validCode&ctype=2" nullmsg="请输入手机收到的短信验证码！" errormsg="验证码输入有误！" sucmsg="恭喜您,验证成功！">asp:TextBox><div style="display: inline-block; vertical-align: middle; margin-top: -2px; height: 38px;" id="divSend"><a class="telcode" id="getCode" href="#">获取短信验证码a>div>div><div class="inline-block">div>
div>js:
$(function () {var valid_rule = $(".form-horizontal").Validform({datatype: {//传入自定义datatype类型，可以是正则，也可以是函数（函数内会传入一个参数）;"n6": /^\d{6}$/},tiptype: 2});
});
$("#txtTel").blur(function () {$("#txtTelCode").attr("ajaxurl", "/tools/validreg.ashx?regType=validCode&ctype=2&phone=" + $('#txtTel').val());
});

修改后：

html:
class="valGroup">class="valGroup-item-1 inline-block">* 短信验证码：class="valGroup-item-2 formControls inline-block">"txtTelCode" runat="server" CssClass="input-text-1" Width="200px">"display: inline-block; vertical-align: middle; margin-top: -2px; height: 38px;" id="divSend">class="telcode" id="getCode" href="#">获取短信验证码class="inline-block">
js:
$(function () {var valid_rule = $(".form-horizontal").Validform({datatype: {//传入自定义datatype类型，可以是正则，也可以是函数（函数内会传入一个参数）;"n6": /^\d{6}$/},tiptype: 2});$("#txtTelCode").keyup(function () {var code = $(this).val();valid_rule.addRule([{ele: "#txtTelCode",datatype: "n6",ajaxurl: "/tools/validreg.ashx?regType=validCode&ctype=2&phone=" + $('#txtTel').val(),nullmsg: "请输入手机收到的短信验证码！",errormsg: "验证码输入有误！",sucmsg: "恭喜您,验证成功！"}]);});
});

总结：虽然使用现成的插件很简单，比如文中的validform验证，但我们不可忽略的问题是任何东西都不是完美的，在使用过程中会出现各种各样的问题。尽管插件并非我们自己所写，但我们却可以在了解它的基础上作完善，不要因为这个插件不好用，而再去找个更好用的插件，事实证明既然它受这么多人追捧是有其自身确实实用的价值。简而言之，遇到问题就要解决它，而非逃避。

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！