jQuery插件在WordPress中不起作用

Question

我正在嘗試將jQuery插件實現到我的wordpress網站。 我已經弄清楚了如何使jQuery運行，但是該插件仍然無法正常工作。 就是這個插件： contenthover

我這樣嘗試過：

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="http://example.com/wp-content/themes/xenia/assets/js/jquery.contenthover.min.js"></script>
<script type="text/javascript">
    <!--//-->
    <![CDATA[//>
    <!--
        jQuery(document).ready(function() {
            $('#d1').contenthover({
                overlay_background:'#000',
                overlay_opacity:0.8
            });
        });
     //-->
    <!]]//>
</script>

無論我嘗試什么都行不通。 我已經通過functions.php包含了jQuery和插件。 當我調用簡單的slideUp(); 它有效，但contenthover-plugin無效。 我究竟做錯了什么？

編輯：這也是我通過將其掛接到主題的functions.php中來嘗試的方法

wp_register_script(THEME_SLUG . '-jqueryMain', THEME_URI . '/assets/js/jquery-2.1.4.min.js', array('jquery'));
wp_register_script(THEME_SLUG . '-contenthover', THEME_URI . '/assets/js/jquery.contenthover.min.js', array('jquery'));

wp_enqueue_script(THEME_SLUG . '-jqueryMain');
wp_enqueue_script(THEME_SLUG . '-contenthover');

Answer 1

WordPress使用noconflict包裝器，因為其他庫也將$用作核心變量，因此$在WordPress中不直接可用。

如果仍要在腳本中使用$ ，則必須按以下方式定義它：

jQuery(document).ready(function($) {
//                              ^-- add the dollar sign here

在此函數內， $將按預期工作。

您可以在文檔中閱讀有關它的更多信息。

注意：您應該避免自己添加jQuery，否則其他插件或主題可能會依賴WordPress提供的jQuery版本。 只需排隊WordPress WordPress提供的jQuery。