将jquery添加到wordpress站点

我对使用jquery非常陌生，如果这是非常基本的东西，我很抱歉

我一直在JSFIDLE上玩，得到了一些jquery来做我想做的事情（当你把鼠标悬停在孩子身上时，将一个类添加到父类中），但是当我获取代码并尝试将其添加到我的wordpress站点时，它就不起作用了

这是我试图添加的代码：

$('.explore > .country').hover(function() {
$(this).parent().toggleClass('hover');
})

我知道wordpress不喜欢$for函数，我尝试了以下方法：

<script type="text/javascript">
(function($) {
$('.explore > .country').hover(function() {
$(this).parent().toggleClass('hover');
})
})(jQuery);
</script>

（函数（$）{
$（'.explore>.country'）。悬停（函数（）{
$（this.parent（）.toggleClass（'hover'）；
})
})（jQuery）；

这里还有一个链接到

---

任何帮助都将不胜感激。

如果我正确理解您的问题，您所要做的就是：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

---

在两个

标记之间

请确保首先将jQuery排队。它内置于wordpress中，但不是预先激活的

在主题的function.php文件中搜索“wp_enqueue”，如果有一个函数已经存在，请在其中添加以下行

wp_enqueue_script( 'jquery' );

否则，请创建自己的排队脚本函数

// function to enabled (enqueue) scripts in wordpress
function enqueue_scripts() {
    wp_enqueue_script('jquery');
}
add_action('wp_enqueue_scripts','enqueue_scripts');

---

更新

---

或者

您可以使用自定义代码创建一个js文件，并在站点范围内排队使用

创建一个名为mycustomfunctions.js的文件

把这个放进去

// describe function here
jQuery(function() {
    jQuery('.explore > .country').hover(function() {
        jQuery(this).parent().toggleClass('hover');
    })
    jQuery('.explore > .community').hover(function() {
        jQuery(this).parent().toggleClass('hover2');
    })
});

在子主题根文件夹中创建一个新文件夹，将其命名为“js”

将

mycustomfunctions.js

放入

js

文件夹

编辑子主题functions.php以包括

// function to enable (enqueue) scripts in wordpress
function enqueue_scripts() {
    wp_enqueue_script('mycustomfunctions', get_stylesheet_directory_uri() . '/js/mycustomfunctions.js', array('jquery') );
}
add_action('wp_enqueue_scripts','enqueue_scripts');

注意-无需单独将jquery排队，因为我们已将其列为mycustomfunctions的依赖项（请参见数组），wordpress将自动将jquery排队，因为这是必需的依赖项。

尝试以下答案：

使用$将返回未定义的，请改用jQuery。

函数myCustomScript（）{？>
function myCustomScript() { ?>
<script type="text/javascript">
jQuery( document ).ready(function() {
    jQuery('.explore > .country').hover(function() {
        jQuery(this).parent().toggleClass('hover');
    })
});
</script>
<?php
}
add_action( 'wp_footer', 'myCustomScript' );

jQuery（文档）.ready（函数（）{
jQuery（'.explore>.country'）.hover（函数（）{
jQuery（this.parent（）.toggleClass（'hover'）；
})
});
我在我的子主题中创建了一个functions.php并添加了它，但仍然没有解决问题。我也尝试了Monica的建议，将$替换为“jQuery”，但也没有解决问题。关于没有冲突，这里介绍了如何使用jQuery而不是$编写它。两个悬停都包装在一个文档就绪的函数中。另外，你确定你在正确的主题文件夹？Functions.php是一个非常常见的文件，可以在大多数主题中找到。