2

这是代码的浓缩版本，实际版本太长无法发布，但这足以代表概念。我正在使用它来根据锚点表示的几个选择来切换吉他图，锚点在 href="" 中具有相应的 id。在花了几天时间让它在静态 html 页面上正常工作后，该脚本将无法在我打算使用它的 Wordpress 页面中工作。我已经尝试使用头部或内联脚本（这不重要） - 但无论哪种方式它都不会起作用。我知道 Wordpress 和某些插件使用 Jquery，因此可能存在版本不匹配导致冲突。我（还）不是 javascript 方面的专家，但我知道俗话说有几种方法可以给猫剥皮，我只需要找到一种与 Wordpress 配合得很好的方法。

<script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {

    var divswitch = $('div.diagram_container a');

    divswitch.bind('click',function(event){
        var $anchor = $(this);
        var ids = divswitch.each(function(){
           $($(this).attr('href')).hide();   
        });
        $($anchor.attr('href')).show();
        event.preventDefault();
    });


});
</script>

<style>
.diagram {
    margin: 0;
    width: 100%;
}
.diagram_container {
    width: 100%;
}
</style>

    <div id="RH_RW_Div" class="diagram_container" style="float:left; display:block;">
        <div class="diagram_menu">
          <a class="checked" href="#RH_RW_Div"><span class="checkbox_label">Right Handed</span></a> 
          <a class="unchecked" href="#LH_RW_Div"><span class="checkbox_label">Left Handed</span></a>
        </div>
        <img class="diagram" src='images/RH_RW.gif' /><br />
    </div>

    <div id="LH_RW_Div" class="diagram_container" style="float:left; display:none;">
        <div class="diagram_menu">
          <a class="unchecked" href="#RH_RW_Div"><span class="checkbox_label">Right Handed</span></a> 
          <a class="checked" href="#LH_RW_Div"><span class="checkbox_label">Left Handed</span></a>
        </div>
        <img class="diagram" src='images/LH_RW.gif' /><br />
    </div>
4

2 回答 2

1

我的猜测是您的 Wordpress 安装或插件已经在头脑中加载了 jQuery。检查它是否存在，如果存在，请不要再次调用它。

如果还是不行，而且你有这个网站在线，把链接发给我，我会看看。

调用 jQuery 两次通常会导致问题。如果您特别需要 1.8.3（wp_register_script和wp_enqueue_script），还有一种加载 jQuery 和覆盖 Wordpress 版本的正确方法，但我认为您还不需要走这条路。

于 2013-03-29T18:44:49.677 回答
1

Wordpress 默认使用jQuery.noConflict()。这是为了确保使用该$变量的其他库不会发生冲突。这就是为什么你的控制台说它不是一个功能。

但是，很明显，该jQuery变量仍然有效，您应该使用它，并$自己将变量传递给您的函数以启用jQuery.

所以你的代码应该是这样的：

jQuery(document).ready(function($){

     // Your functions go here

});
于 2013-03-29T19:01:38.217 回答