在 Ajax 内容加载时初始化 Visual Composer

Question

下面的基本结构，有一个 ajax 脚本替换 div 内部内容并更新菜单，推送历史状态，淡化 in/out 内容等..

内部内容包含基础网格行，wordpress 编辑器的内容位于该容器内。

现在的问题是...当使用任何需要 javascript 触发器、全宽跨度、滑块、动画的 Visual composer 函数时，当我的 ajax 函数触发内容时，不会再次加载任何内容替换。

这是我的部分代码，在 ajax 获得内容后加载。

// Update the content
$content.stop(true,true);
//$("[data-vc-grid-settings]").vcGrid();
$('#content').foundation();
$content.html(contentHtml).ajaxify().css('opacity',100).show(); /* you could fade in here if you'd like */

// Update the title
document.title = $data.find('.document-title:first').text();

我认为 .vcGrid() 是正确的初始化，但得到了未定义的控制台错误。在哪里可以找到与重新初始化可视化编辑器元素相关的文档？

<html>
<header>
Meta Content
</header>
<div off-canvus>
   <menu></menu>
   <div content>
      <div inner-content>

      </div>
   </div>
   <footer>
   </footer>
   <scripts>
</html>

Answer 1

在挖掘 visual composer 的 javascript 后找到了我需要的数据，为 window 添加了一个调整大小的操作，它触发 visual composer 的网格正常工作。

$content.stop(true,true);
window.vc_js();
window.resize();
$('#content').foundation();
$content.html(contentHtml).ajaxify().css('opacity',100).show(); /* you could fade in here if you'd like */

// Update the title
document.title = $data.find('.document-title:first').text();
try {
    document.getElementsByTagName('title')[0].innerHTML = document.title.replace('<','&lt;').replace('>','&gt;').replace(' & ',' &amp; ');
}
catch ( Exception ) { }

Answer 2

添加一些自定义 javascript 逻辑在 Visual Composer 网格已加载后这样做：

$(window).bind( 'grid:items:added', function(){ 
  // add some logic here
});

有关详细信息，请查看此问题 =>

在 Ajax 内容加载时初始化 Visual Composer

Initializing Visual Composer upon Ajax content load

html

ajax

jquery

visual-composer