JQuery 和 Wordpress 添加活动类答案

【问题标题】：JQuery and Wordpress adding active classJQuery 和 Wordpress 添加活动类
【发布时间】：2013-11-03 04:43:03
【问题描述】：

我正在尝试通过 jquery 向我的导航添加一个活动类：

<script type="text/javascript">
            $( '.nav li a' ).each(function() {
                $(this).removeClass('active');
            });
            $('.nav li a').eq(0).addClass("active");
        </script>

我正在使用 wordpress，可以看到 jquery 已定义：

<script type='text/javascript' src='https://artendijen.com/wp-includes/js/jquery/jquery.js?ver=1.10.2'></script>

但是我在控制台日志中收到此错误：

Uncaught TypeError: Property '$' of object [object Object] is not a function

并且活动类未添加到我的导航中。

我尝试将此代码放在 header.php 和 page.php 中，但给了我上面相同的错误。

这是我的 CSS：

<div class="navigation">

    <div class="logo">
        <a href="/"><img src="/wp-content/themes/twentytwelve/images/logo.png" width="275" /></a>
    </div><!--logo-->

    <ul class="nav">
        <li><a href="/about-us">About Us</a></li>
        <li><a href="/shop">Gallery & Shopping</a></li>
        <li><a href="/latest-news">Latest News</a></li>
        <li><a href="/contact-us">Contact Us</a></li>
        <li><a href="/links">Links</a></li>
    </ul>

</div>

我能做些什么来解决这个问题？任何帮助将不胜感激。

【问题讨论】：

主题可能使用了jQuery.noConflict，这可能会删除jQuery 的$ 别名。在包括本地 jQuery.js 在内的脚本文件中搜索 noConflict

标签： jquery css wordpress

【解决方案1】：

您提供链接的 jQuery.js 文件的底部是 jQuery.noConflict()，它确实删除了 $ 别名。

您应该能够通过将代码包装在以下内容中来解决它：

/* allows use of `$` in your code*/
(function($){
 /* wait for page to load before running code*/
  $(function(){
      /* your code here */
  });
})(jQuery);

确保此代码的脚本标记放置在 jQuery.js 加载之后

【讨论】：