Javascript 滑块不工作,I';我们得到了类型错误:jQuery(…)。easyResponsiveTabs不是函数

Javascript 滑块不工作,I';我们得到了类型错误:jQuery(…)。easyResponsiveTabs不是函数,javascript,php,jquery,html,wordpress,Javascript,Php,Jquery,Html,Wordpress,好的,我有一个wordpress网站: 我有一个滑块问题,出现以下错误: “类型错误:jQuery(…)。easyResponsiveTabs不是函数” 激活:函数(事件){//切换制表符时回调函数 关于firebug——我认为这是比bxSlider更重要的问题- 我不是那个制作网站的人,但是上一个开发者跑掉了,我必须修复这个问题 我知道像这样的错误可能是由于jQuery或jQuery ui文件的路径造成的,但我已经检查过了 当我尝试在验证时,它给出了一些关于元素的错误,因为它们在footer.

好的,我有一个wordpress网站:

我有一个滑块问题,出现以下错误:

“类型错误:jQuery(…)。easyResponsiveTabs不是函数”

激活:函数(事件){//切换制表符时回调函数

关于firebug——我认为这是比bxSlider更重要的问题-

我不是那个制作网站的人,但是上一个开发者跑掉了,我必须修复这个问题

我知道像这样的错误可能是由于jQuery或jQuery ui文件的路径造成的,但我已经检查过了

当我尝试在验证时,它给出了一些关于
元素的错误,因为它们在footer.php文件中。所以我将它们移动到header.php并进行了验证

所以我的滑块(水平和垂直)不工作,我真的不明白为什么我有这个错误。我的意思是它与滑块有什么关系

这是我的头部标记

<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width">
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script type="text/javascript" src="/wp-content/themes/aykamakina/bxslider/jquery.bxslider.min.js"></script>
<link type="text/css" href="/wp-content/themes/aykamakina/bxslider/jquery.bxslider.css" rel="stylesheet" media="all">
<script src="/wp-content/themes/aykamakina/tabs/js/easyResponsiveTabs.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="/wp-content/themes/aykamakina/tabs/css/easy-responsive-tabs.css">
<link rel="stylesheet" href="/wp-content/themes/aykamakina/fancybox/source/jquery.fancybox.css" type="text/css" media="screen">
<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css" media="all">
<script type="text/javascript" src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript" src="/wp-content/themes/aykamakina/fancybox/source/jquery.fancybox.js"></script>

在尝试了许多不同的方法之后,我成功地解决了自己的问题。我将bxSlider、easyResponsiveTabs的JavaScript文件和调用它们的脚本放到footer.php。但是我将jQuery&jQuery UI文件和用于滑块的css文件放在header.php

现在一切都很好,标记通过了验证测试!如果你有同样的错误

  • 检查jQuery和其他JavaScript文件路径

  • 检查您使用的是旧版本的jQuery还是不兼容 jQuery和jqueryui的版本

  • 不要与那些可能会破坏你链接的愚蠢的开发人员合作 文件到footer.php
  • 检查是否有不同的jquery.min.js实例和版本
  • (对于我的情况)将bxSlider js文件放到footer.php中,但是 将css文件保留在header.php中(用于验证,仅此而已) (效果良好)

  • 你也可以在这里写,我可以试着帮你。

    这里有一个关于如何使用jQuery.noConflict()的示例
    <div class="the-main-slider-container">
    <ul class="bxslider">
    
        <li>
            <img alt="slider" src="/wp-content/uploads/2014/03/slider-1.jpg">
        </li>
    
        <li>
            <img alt="slider" src="/wp-content/uploads/2014/03/slider-2.jpg">
        </li>
    
        <li>
            <img alt="slider" src="/wp-content/uploads/2014/03/slider-3.jpg">
        </li>
    
        <li>
            <img alt="slider" src="/wp-content/uploads/2014/03/slider-4.jpg">
        </li>
    
        <li>
            <img alt="slider" src="/wp-content/uploads/2014/03/slider-5.jpg">
        </li>
    
    </ul>
    
    <div id="bx-pager">
    <div class="pager-wrapper">
        <div class="pager-container">
            <a data-slide-index="0" href=""><img alt="icone" src="/wp-content/uploads/2014/03/D320-icone-features-features.png"></a>
            <a data-slide-index="1" href=""><img alt="icone" src="/wp-content/uploads/2014/03/D320-icone-features-confezioni.png"></a>
            <a data-slide-index="2" href=""><img alt="icone" src="/wp-content/uploads/2014/03/D320-icone-features-vantaggi.png"></a>
            <a data-slide-index="3" href=""><img alt="icone" src="/wp-content/uploads/2014/03/D320-icone-features-specifiche.png"></a>
            <a data-slide-index="4" href=""><img alt="icone" src="/wp-content/uploads/2014/03/d320-icone-compact2.png"></a>
        </div>
    </div>
    </div>
    </div>
    
    <script type="text/javascript"> 
            jQuery.noConflict();
    
             jQuery(document).ready(function() 
             {
                jQuery('.bxslider').bxSlider({
                    pagerCustom: '#bx-pager',
                    mode: 'fade'
                });
    
             });  
    
            jQuery(function ($) {
            $(document).ready(function(){
              $('.slider8').bxSlider({
                mode: 'vertical',
                slideWidth: 300,
                minSlides: 2,
                slideMargin: 10
              });
            }); 
            });
    
            jQuery(document).ready(function() {
                jQuery(".various").fancybox({
                    maxWidth    : 450,
                    maxHeight   : 400,
                    fitToView   : false,
                    width       : '70%',
                    height      : '70%',
                    autoSize    : false,
                    closeClick  : false,
                    openEffect  : 'none',
                    closeEffect : 'none'
                });
            });
    
            </script>
    
     <script type="text/javascript">
                jQuery(document).ready(function () {
                   jQuery('#horizontalTab').easyResponsiveTabs({
                        type: 'default', //Types: default, vertical, accordion           
                        width: 'auto', //auto or any width like 600px
                        fit: true,   // 100% fit in a container
                        closed: 'accordion', // Start closed if in accordion view
                        activate: function(event) { // Callback function if tab is switched
                            var $tab = jQuery(this);
                            var $info = jQuery('#tabInfo');
                            var $name = jQuery('span', $info);
    
                            $name.text($tab.text());
    
                            $info.show();
                          }
                       });
                    });
                </script>
    
    <script type="text/javascript">
        var j = jQuery.noConflict();
                j(document).ready(function () {
                   j('#horizontalTab').easyResponsiveTabs({
                        type: 'default', //Types: default, vertical, accordion           
                        width: 'auto', //auto or any width like 600px
                        fit: true,   // 100% fit in a container
                        closed: 'accordion', // Start closed if in accordion view
                        activate: function(event) { // Callback function if tab is switched
                            var $tab = jQuery(this);
                            var $info = jQuery('#tabInfo');
                            var $name = jQuery('span', $info);
    
                            $name.text($tab.text());
    
                            $info.show();
                        }
                    });
    
                });
            </script>