WordPress jquery .load(URL + ' #grabMe') with Visual Composer

Question

我正在使用jquery.load(url+'#grabMe'(将使用visualcomposer生成的posts内容加载到页面上的div中；

然而，一旦post被加载到正确的块中，posts滑块、videos、masonary、faq滑块都不起作用，因为js已经从内容加载中剥离。。。本质上，我想问的是，有没有一种方法可以重新触发visualcomposers页面设置js代码？

我的JS代码如下

var $mainContent = $("#supportResultSet"),
        url = ''; 
    $('a.ajaxMe').on("click", function(e) {
        e.preventDefault();
        location.hash = this.pathname;
        $('a.ajaxMe').removeClass('activeMod');
        $(this).addClass('activeMod');
    }); 

    $(window).bind('hashchange', function(){
        url = window.location.hash.substring(1); 
        if (!url) {
            return;
        } 
        url = url + " #grabMe"; 
        $mainContent.animate({opacity: "0.4"}).html('Loading...').load(url, function() {
            page_setup();
            addAjaxSupportTaxonomyLoad();
            $mainContent.animate({opacity: "1"});
            $('html,body').animate({
              scrollTop: $mainContent.offset().top
            }, 1000);

        });
    });
    $(window).trigger('hashchange');

如有任何帮助，将不胜感激

Answer 1

好吧，这有点麻烦，但我找到了一个解决方案。

visualcomposer使用一个名为vcv的javascript对象

您可以通过调用来触发vcv就绪

vcv.trigger("就绪"(；

然而。。。由于我是通过$.load(url+"#grabMe"(加载帖子内容的，我们也没有加载相关/必需的JS/CSS文件来从VC 设置内容

为了解决这个问题，我加载了整个帖子，去掉了页眉、页脚和侧边栏附加内容(使用所需的js/css(，然后调用vcv.trigger('ready'(；

JS 见下文

jQuery(document).ready(function($) {
    addAjaxSupportResultSetLoad();     
    addAjaxSupportTaxonomyLoad();     
});
function addAjaxSupportResultSetLoad(){
    var $mainContent = $("#supportResultSet"),
            url = ''; 
    
        $('a.ajaxMe').on("click", function(e) {
            e.preventDefault();
            location.hash = this.pathname;
            
            $('a.ajaxMe').removeClass('activeMod');
            $(this).addClass('activeMod');
        }); 
        
        $(window).bind('hashchange', function(){
            url = window.location.hash.substring(1); 
            if (!url) {
                return;
            } 
            url = url + " #grabMe"; 
            $mainContent.animate({opacity: "0.4"}).html('Loading...').load(url, function() {
                page_setup();
               
                addAjaxSupportTaxonomyLoad();
                $mainContent.animate({opacity: "1"});
                $('html,body').animate({
                  scrollTop: $mainContent.offset().top
                }, 1000);
               
            });
        });
        $(window).trigger('hashchange');
}
function addAjaxSupportTaxonomyLoad(){
    
    if($('.loadTaxonomy').length > 0 ){
        $('.loadTaxonomy').click(function(e){
            e.preventDefault();
            termID = $(this).attr('data-ref-id');
            $('#termToggleBlock_'+termID).slideToggle();
        });
    }
    
    if($('.loadPost').length > 0 ){
        
        $('#taxonomyBlock').scrollbar();
         
        $('.loadPost').click(function(e){
            e.preventDefault();
            
            termID = $(this).attr('data-ref-term-id');
            postID = $(this).attr('data-ref-post-id');
            
            loadedTaxonomy = $('#taxonomyBlock').attr('data-ref-loaded-taxonomy');
 
            if(loadedTaxonomy !== termID){
                var $taxonomyBlock = $("#taxonomyBlock"),
                url2 = $(this).attr('data-href-term'); 
                if (!url2) {
                    return;
                } 
                url2 = url2+ "?stripMe=1" + " #bodyBlock"; 
                $taxonomyBlock.animate({opacity: "0.4"}).html('Loading...');
                $.get(url2, function(data) {                     
                     theResult = $("<div/>").append( $('head', data).remove().end() ).html();
                     theResult = $("<div/>").append( $('header', theResult).remove().end() ).html();
                     theResult = $("<div/>").append( $('footer', theResult).remove().end() ).html();
                     theResult = $("<div/>").append( $('#pageTitle', theResult).remove().end() ).html();
                     $taxonomyBlock.html(theResult);
                     $('#taxonomyBlock').attr('data-ref-loaded-taxonomy', termID);
                     page_setup();
                     vcv.trigger('ready');
                     $taxonomyBlock.animate({opacity: "1"});
               });
               
               
               $('html,body').animate({
                  scrollTop: $taxonomyBlock.offset().top
                }, 1000);
            }else{
                var $termBlock = $("#taxonomyPost_"+postID);
                $('html,body').animate({
                  scrollTop: $termBlock.offset().top
                }, 1000);
            }
            
        });
        
        $('.loadPost:first').trigger('click');
    }
    
    
        
}