Javascript 为什么'；此jQuery图像映射在WordPress上不起作用

您好，我已经在codepen上制作了一个jQuery图像映射，但是当我将它传输到我的客户WordPress安装时，它不再工作了

WordPress网站是用genesis制作的，我认为这可能是造成问题的原因。。。我还将

$

替换为

jQuery

，以停止冲突问题

钢笔：

jQuery：

jQuery(document).ready(function($) {
   jQuery(".clickable").click(function() {
       var toHide = $(this).attr('data-hide');
       jQuery(".map").toggle();
       jQuery("#" + toHide).toggle();
   });

   jQuery(".hide").click(function() {
       jQuery(".map").toggle();
       jQuery(this).toggle();
   });

}))

网站www.shakesafe.co.nz

我用简单的钩子在主页上添加了代码（HTML+JS），然后在gensis samples样式表中为主页添加了带有自定义body标记的CSS。。但是Jquery不起作用？你们知道为什么吗

---

一如既往地感谢您的时间和努力

可能是因为第三行的美元： var toHide=$（this.attr（'data-hide'）

尝试将其更改为jQuery。这可能有用

此外，您的站点代码中没有$：

jQuery（文档）.ready（函数（）{

---

尝试将$放在函数后的小括号中

始终检查您的浏览器控制台是否抛出错误。在这种情况下，我看到一个

未捕获的TypeError:undefined不是一条函数

消息。该错误出现在页面的第112行，如果您仔细检查，您正在使用

$

，而没有分配jQuery对象将其删除，因此导致错误：

jQuery(document).ready(function() {
     jQuery(".clickable").click(function() {
       var toHide = $(this).attr('data-hide');  // Line 112 where error is from
         jQuery(".map").toggle();
         jQuery("#"+toHide).toggle();
    });

     jQuery(".hide").click(function() {
       jQuery(".map").toggle();
       jQuery(this).toggle();
    });
});

将

$

替换为

jQuery

，即

var-toHide=jQuery（this.attr（'data-hide'）；

或者，您可以告诉jQuery您正在使用

$

来代替jQuery对象，为它调用的每个实例节省5个字符：

jQuery(document).ready(function($) {
     $(".clickable").click(function() {
       var toHide = $(this).attr('data-hide');
         $(".map").toggle();
         $("#"+toHide).toggle();
    });

     $(".hide").click(function() {
       $(".map").toggle();
       $(this).toggle();
    });
});

---

这不是真的-OP已经将

$

委托给jQuery对象（在第一行，

jQuery（document）.ready（function（$）…

），所以使用

$

代替jQuery对象应该没有问题。@Terry你的答案是我的更详细的形式。请在评论我的答案不正确之前仔细检查我的答案。