主题正在导致插件的AJAX冲突我无法识别它

时间:2020-06-22 作者:Someguy

这有点奇怪,这是与插件相关的,但遗憾的是,1个月后,插件所有者没有回应,我转向了社区

问题是我有这个插件;“视觉组合”;它使用Ajax为库过滤和加载图像

现在,经过几个小时的摆弄,删除jq,删除插件,试图找出问题所在,我发现每当我在主题中调用我的页脚时,插件的ajax都会停止工作

因此,每当我说即使我从页脚中删除每一行代码,它也会中断,除了<?php wp_footer(); ?>

我完全不知所措,我从网站上删除了所有的jq插件,但由于某种原因,它适用于2020主题,所以我知道这是一个冲突,

在所有人都投入讨论之前,你们是否对这类事情的一般调试有一些建议,并说这不是插件特定的支持,我想问一下你们自己如何解决这个问题,请告诉我您可能需要的任何代码。

小注:图库是根据帖子类型和该帖子类型的特色图片填充的。

我会添加我的页脚和一个显示图库的页面,

<?php wp_footer(); ?>
<script>
const backToTopButton = document.querySelector("#back-to-top-btn");

window.addEventListener("scroll", scrollFunction);

function scrollFunction() {
  if (window.pageYOffset > 300) { // Show backToTopButton
    if(!backToTopButton.classList.contains("btnEntrance")) {
      backToTopButton.classList.remove("btnExit");
      backToTopButton.classList.add("btnEntrance");
      backToTopButton.style.display = "block";
    }
  }
  else { // Hide backToTopButton
    if(backToTopButton.classList.contains("btnEntrance")) {
      backToTopButton.classList.remove("btnEntrance");
      backToTopButton.classList.add("btnExit");
      setTimeout(function() {
        backToTopButton.style.display = "none";
      }, 250);
    }
  }
}

backToTopButton.addEventListener("click", smoothScrollBackToTop);

// function backToTop() {
//   window.scrollTo(0, 0);
// }

function smoothScrollBackToTop() {
  const targetPosition = 0;
  const startPosition = window.pageYOffset;
  const distance = targetPosition - startPosition;
  const duration = 750;
  let start = null;
  
  window.requestAnimationFrame(step);

  function step(timestamp) {
    if (!start) start = timestamp;
    const progress = timestamp - start;
    window.scrollTo(0, easeInOutCubic(progress, startPosition, distance, duration));
    if (progress < duration) window.requestAnimationFrame(step);
  }
}

function easeInOutCubic(t, b, c, d) {
    t /= d/2;
    if (t < 1) return c/2*t*t*t + b;
    t -= 2;
    return c/2*(t*t*t + 2) + b;
};    
</script>
<footer>
    <button id="back-to-top-btn"><i class="fas fa-angle-double-up"></i></button>
    <section class="footer ">
        <div class="container ta-c">
        <div class="footer-top">
            <div class="row img-row">
                <div class="col-md-3 col-6">
                    <img class="footer-img" src="<?php echo home_url();?>/wp-content/uploads/2020/04/footer-img-1.png">
                </div>
                <div class="col-md-3 col-6">
                    <img class="footer-img" src="<?php echo home_url();?>/wp-content/uploads/2020/04/footer-img-2.png">
                </div>
                <div class="col-md-3 col-6">
                    <img class="footer-img" src="<?php echo home_url();?>/wp-content/uploads/2020/04/footer-img-3.png">
                </div>
                <div class="col-md-3 col-6">
                    <img class="footer-img" src="<?php echo home_url();?>/wp-content/uploads/2020/04/footer-img-4.png">
                </div>
            </div>
            <div class="row" style="width: 100%">
                <div class="col-md-3 footer-block">

                    <h5>NEW BUSINESS INQUIRIES</h5>
                    <h2 ></h2>
                    <p class="railway-simple mg-remove">RESEARCH & MARKETING MANAGER</p>
                    <a class="footer-mail" href="mailto:"></a>
                </div>
                <div class="col-md-3 footer-block">

                    <h5>CALL US</h5>
                    <a  href="tel:">(</a>
                </div>
                <div class="col-md-3 footer-block">

                    <h5>POP IN FOR A CHAT</h5>
                    <a  href=""></a>
                    <p class="railway-simple" ></p>
                </div>
                <div class="col-md-3 footer-block">

                    <h5>FOLLOW US</h5>
                   <a style="margin: 10px;" href=""> <i class=" fab fa-facebook-f"></i></a>
                    <a href=""><i class="fab fa-linkedin-in"></i></a>
                </div>
            </div>
        </div>
            <div class="parent-footer">
                <h2>SITEMAP</h2>
            </div>

        <div class="footer-sitemap row">

            <div class="col-md-2">
                <h3>We are.</h3>
                <ul>
                    <li><a href="<?php echo get_home_url(); ?>/lionremaster">Home</a></li>
                    <li><a href="<?php echo get_home_url(); ?>/about/">We are</a></li>
                    <li><a href="<?php echo get_home_url(); ?>/about">About</a></li>
                    <li><a href="<?php echo get_home_url(); ?>/theteam">Meet the team</a></li>
                </ul>
            </div>
            <div class="col-md-2">
                <h3>We do.</h3>
                <ul>
                    <li><a href="<?php echo get_home_url(); ?>/wedo/#services">Services</a></li>
                    <li><a  href="<?php echo get_home_url(); ?>/partners">Partners</a></li>

                    <li><a>Freebies</a></li>
                </ul>
            </div>
            <div class="col-md-2">
                <h3>Why us.</h3>
                <ul>
                    <li><a href="<?php echo get_home_url(); ?>/whyus">Why us</a></li>
                </ul>
            </div>
            <div class="col-md-3">
                <h3>Who we work with.</h3>
                <ul>
                    <li><a href="<?php echo get_home_url(); ?>/brandstories">Brand Stories</a></li>
                    <li><a href="<?php echo get_home_url(); ?>/gallery">Gallery</a></li>
                    <li><a>Case Studies</a></li>
                    <li><a href="<?php echo get_home_url(); ?>/news">Industry News</a></li>
                </ul>
            </div>
            <div class="col-md-2">
                <h3>Get in touch.</h3>
                <ul>
                    <li><a href="<?php echo get_home_url(); ?>/getintouch">Contact us</a></li>
                </ul>
            </div>

         </div>
        </div>
    </section>
</footer>
<?php
get_header();
?>
<section class="brand-main">
    <div class="container">
        <div class="brand-header">
            <img class="line-img" src="<?php echo home_url();?>/wp-content/uploads/2020/04/Asset-10.png">
            <h4 style="letter-spacing: 2px;" class="railway-regular mg-top-s">BRAND STORIES</h4>
            <h1 class="railway-extra ">A PRIDE OF
                BRAND STORIES
                TO TALK ABOUT</h1>
            <img class="line-img mg-top-s" src="<?php echo home_url();?>/wp-content/uploads/2020/04/Asset-10.png">
        </div>
        <div class="brand mg-top-m">
            <?php
            echo do_shortcode(\'[visual_portfolio id="191" class=""]\');
            ?>

            </div>
    </div>
</section>
<?php
get_footer();
?>


还有我的网站的jq文件:

function openTab(evt, cityName) {
    let buttonIndex = -1;
    const $clickedButton = $(evt.target); //Using Jquery to get the button which was clicked
    const tabcontent = document.getElementsByClassName("tabcontent");

    for (i = 0; i < tabcontent.length; i++) {
        tabcontent[i].style.display = "none";
    }

    if($clickedButton.hasClass(\'tablinks\')){
        $(\'.tablinks\').each(function(i, el){
            if($(el).is($clickedButton)){
                buttonIndex = i;
                return false; //break from the each now that we have the button index
            }
        });
    } else {
        $(\'.tablinks-title\').each(function(i, el){
            if($(el).is($clickedButton)){
                buttonIndex = i;
                return false; //break from the each now that we have the button index
            }
        });
    }

    //Remove active class from buttons before adding to newly selected
    $(\'.tablinks\').removeClass(\'active\');
    $(\'.tablinks-title\').removeClass(\'active\');

    //Add the active class to the corresponding buttons at the clicked index for both
    //Number and title
    $($(\'.tablinks\')[buttonIndex]).addClass(\'active\');
    $($(\'.tablinks-title\')[buttonIndex]).addClass(\'active\');

    document.getElementById(cityName).style.display = "block";
  

}
  document.getElementById("defaultOpentitle").click();
    document.getElementById("defaultOpen").click();

filterSelection("all")
function filterSelection(c) {
    var x, i;
    x = document.getElementsByClassName("column");
    if (c == "all") c = "";
    for (i = 0; i < x.length; i++) {
        w3RemoveClass(x[i], "show");
        if (x[i].className.indexOf(c) > -1) w3AddClass(x[i], "show");
    }
}

function w3AddClass(element, name) {
    var i, arr1, arr2;
    arr1 = element.className.split(" ");
    arr2 = name.split(" ");
    for (i = 0; i < arr2.length; i++) {
        if (arr1.indexOf(arr2[i]) == -1) {element.className += " " + arr2[i];}
    }
}

function w3RemoveClass(element, name) {
    var i, arr1, arr2;
    arr1 = element.className.split(" ");
    arr2 = name.split(" ");
    for (i = 0; i < arr2.length; i++) {
        while (arr1.indexOf(arr2[i]) > -1) {
            arr1.splice(arr1.indexOf(arr2[i]), 1);
        }
    }
    element.className = arr1.join(" ");
}


// Add active class to the current button (highlight it)
var btnContainer = document.getElementById("myBtnContainer");
var btns = btnContainer.getElementsByClassName("btnz");
for (var i = 0; i < btns.length; i++) {
    btns[i].addEventListener("click", function(){
        var current = document.getElementsByClassName("active");
        current[0].className = current[0].className.replace(" active", "");
        this.className += " active";
    });
}







添加注释

我将提供一个站点链接,你可以看看这些图库,你会发现我的ajax Im没有任何功能,我只想证明站点的完整副本以获得一些帮助,我现在有两个站点正在使用这个插件,它们共享相同的主题模板,存在一个冲突,忽略了我的所有ajax,我只是不知道它是什么

如果您需要任何详细信息,请告诉我

http://azipit.co.za/lionremaster/

我的新网站上的php函数只是一个例子,所以你可以看到我使用的很少,但仍然存在冲突

<?php 

function wpt_theme_styles() {
    
    wp_enqueue_style( \'fontawesome_css\', \'https://use.fontawesome.com/releases/v5.8.1/css/all.css\' );
    wp_enqueue_style( \'main_css\', get_template_directory_uri() . \'/style.css\' );
    wp_enqueue_style( \'bootstrap_css\', get_template_directory_uri() . \'/css/bootstrap.css\' );
    wp_enqueue_style( \'bootstrap_css\', get_template_directory_uri() . \'/css/jquery-ui.min.css\' );

}
add_action( \'wp_enqueue_scripts\', \'wpt_theme_styles\' );

function my_scripts() {
    wp_enqueue_script( \'bootstrap_js\', get_template_directory_uri() . \'/js/bootstrap.js\', array(\'jquery\'), \'\', false );
    wp_enqueue_script( \'bootstrap_js\', get_template_directory_uri() . \'/js/bootstrap.min.js\', array(\'jquery\'), \'\', false );
    wp_enqueue_script( \'bootstrap_js\', get_template_directory_uri() . \'/js/script.js\', array(\'jquery\'), \'\', false );  
}
add_action( \'wp_enqueue_scripts\', \'my_scripts\' );
这里是新网站结构的截图,这是本地主机,我会发布网站技术的图片;在qeustion中“;还有enter image description here

enter image description here

我有插件检查错误,但没有,所以我不知道在这方面发布什么

现在在日志中发现一条警告:

警告:session\\u start():当标头已发送到/home/aziptfy/public\\u html/lionmaster/wp-content/plugins/visual-portfolio/classes/class-get-portfolio时,无法启动会话。php在线25

这是一个压缩文件,其中包含我使用的主题模板的本地副本,它们的登录名是:U:RoyP:Test

The Google Drive link

除了我的其他网站之外,这里唯一的区别是额外的页面和css,所以这将是我遇到的问题的一个很好的例子

1 个回复
最合适的回答,由SO网友:Someguy 整理而成

设法把它修好了,我不知道为什么会这样,我希望你能解释一下

我必须走到页脚,确保结构如下:

</footer>
<?php wp_footer(); ?>
</body>
</html>
如果<?php wp_footer(); ?> 位于上方</footer> 插件不工作

所以我会悬赏给任何解释