通过AJAX（smoothstate.js）加载页面时，联系表格7引发'wpcf7.initForm不是函数'错误

Question

我试图在我的wordpress网站上使用smoothstate.js实现联系表格7。当使用该页面的页面直接加载时，联系表单可以很好地工作。但是，如果通过AJAX加载页面，则会显示错误“wpcf7.initForm不是函数”。

我不是AJAX的天才，但我的想法是在AJAX onAfter函数中重新初始化。我通过使用wpcf7InitForm（）来试试这个;但仍然没有运气。

任何有关这个主题的帮助将不胜感激！

这是我目前的AJAX代码：

//SmoothState Page Transitions 
 

 
    $(function(){ 
 
    'use strict'; 
 
    var $page = $('#main'), 
 
     options = { 
 
      debug: true, 
 
      prefetch: true, 
 
      onStart: { 
 
      duration: 800, // Duration of our animation 
 
      render: function ($container) { 
 
       // Add your CSS animation reversing class 
 

 
       $container.addClass('is-exiting'); 
 

 
       // Restart your animation 
 
       smoothState.restartCSSAnimations(); 
 
      } 
 
      }, 
 
      onReady: { 
 
       duration: 0, 
 
       render: function($container, $newContent) { 
 
        // Remove your CSS animation reversing class 
 
        $container.addClass('is-loaded'); 
 

 
        setTimeout(function(){ 
 
         $container.addClass('unload'); 
 
        }, 600); 
 

 
        setTimeout(function(){ 
 
         $container.removeClass('is-loaded unload'); 
 
        }, 900); 
 

 

 
        // Inject the new content 
 
        $container.html($newContent); 
 
       } 
 
      }, 
 
      onAfter: function($container) { 
 
       $container.removeClass('is-exiting'); 
 
       $('div.wpcf7 > form').wpcf7InitForm(); 
 
       $(window).data('plugin_stellar').refresh(); 
 
      } 
 
     }, 
 
     smoothState = $("#main").smoothState(options).data("smoothState"); 
 
     });

Answer 1

有一个变化在摆脱了jquery.form.js的所以wpcf7InitForm V4.8联系表格7（上）功能不再有效。然而，一个新的初始化函数被带回在v4.8.1

wpcf7.initForm 

使用此功能来代替：

function initContactForm() { 
$('div.wpcf7 > form').each(function() { 
    var $form = $(this); 
    wpcf7.initForm($form); 
    if (wpcf7.cached) { 
    wpcf7.refill($form); 
    } 
}); 
} 

叫它onAfter，它应该解决您的问题。

以下是关于联系表7支持论坛的讨论： https://wordpress.org/support/topic/init-function-wpcf7initform/