Question

我正在使用 http://www.jqueryscript.net/animation/Animating-Numbers-Counting-Up-with-jQuery-Counter-Up-Plugin.html JS。在普通的html中它工作正常但是当我在WordPress中使用这个脚本时它显示Uncaught TypeError：undefined不是函数错误。我的脚本是

<script src="http://cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.3/waypoints.min.js"></script> 
<script src="<?php bloginfo('template_directory'); ?>/includes/jquery.counterup.js"></script>
<script>
    jQuery(document).ready(function( $ ) {
        $('.counter').counterUp({
            delay: 10,
            time: 1000
        });
    });
</script>
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-36251023-1']);
  _gaq.push(['_setDomainName', 'jqueryscript.net']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

我的HTML是

<div> <span class="counter" style="display: inline-block; width: 32%">100</span> <span class="counter" style="display: inline-block; width: 32%">58</span> <span class="counter" style="display: inline-block; width: 32%">85</span> </div>

提前谢谢。

Answer 1

您将反包的js文件包含为CSS文件

<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/includes/jquery.counterup.js">

用脚本标记替换链接标记，看看是否有任何成功。还尝试在任何其他插件脚本之前包含jQuery库，因为它们很可能需要jQuery

Answer 2

在waypoins.min.js链接后移动jquery.min.js链接。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.3/waypoints.min.js"></script>

此外<link>适用于CSS，但您包含JS文件：

<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/includes/jquery.counterup.js">

Answer 3

检查一下。您没有正确包含脚本。

  <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/includes/jquery.counterup.js">

您需要使用wp_enqueue_script

正确地对脚本进行排队

wp_enqueue_script('mycounter',bloginfo('template_directory').'/includes/jquery.counterup.js',array('jquery'));

如果存在任何依赖项，还要在其他脚本之前加载jquery。

WordPress带有捆绑的 jQuery ，建议使用它而不是使用外部的。

我想在我的WordPress网站上使用counterup.js，但它显示错误

3 个答案: