联系表格 7 Jquery答案

【问题标题】：Contact Form 7 Jquery联系表格 7 Jquery
【发布时间】：2015-05-06 08:18:25
【问题描述】：

我的网站使用联系表格 7 插件作为我的联系表格。

我添加了一个 JQuery 函数，它将在单击提交按钮之前聚焦第一个空字段。

我想要做的是当我点击提交按钮时所有字段都是空的，我想要的是在点击提交按钮后关注第一个空字段。

我应该使用什么 JQuery 函数？现在这是我的 JS：

$( ".col-form3").find( "input:first").focus();

注意：在单击提交按钮之前，上面的 jquery 正在正确执行。

【问题讨论】：

标签： javascript jquery wordpress

【解决方案1】：

你会这样做：

HTML：

<input type="text" name="t1" value="">
<input type="text" name="t2" value="">
<input type="text" name="t3" value="">
<input type="button" name="button" id="button" value="button">

$(document).ready(function(){
    $("#button").on('click',function(){
      $("input:not(:checkbox,:button)").each(function(){       
      if(!$(this).val() ) {
        $(this).focus();
        return false;
          }
      });
    });
});

FIDDLE DEMO

【讨论】：

【解决方案2】：

下面的代码应该适合你：

$(".wpcf7-submit").click(function(){
    $(".wpcf7-submit").ajaxComplete(function(){
        if($(".wpcf7-response-output").hasClass("wpcf7-validation-errors")){
            $(".wpcf7-form-control").each(function(){
                if($(this).val().length === 0){
                    $(this).focus();
                    return false;
                }
            });
        }
    });
});

如果您有任何疑问，请告诉我。

【讨论】：

【解决方案3】：

试试这个java脚本代码：

<script type="text/javascript">
jQuery(document).ready(function($){     
jQuery(".wpcf7-submit").ajaxComplete(function(){           
var check = jQuery( ".wpcf7-form").find( ".wpcf7-not-valid:eq( 0 )");
if(check)
{
check.focus();
}
});

});
</script>

【讨论】：

你可以尝试替换 var check = jQuery( ".wpcf7-form").find( ".wpcf7-not-valid:eq( 0 )"); with var check = jQuery(".wpcf7-form").find(".wpcf7-not-valid:first");