Question

我对此完全不知所措。我已经将$更改为jQuery，我尝试使用noConflict，我尝试使用toggle命令，一个href onClick，现在只是尝试了show / hide方法，似乎没有任何东西在这个主题中工作。我禁用了所有插件，这也没有帮助。该站点已经加载了jquery库，许多其他元素正在使用jQuery。

对遇到类似问题并成功解决问题的人进行故障排除的任何帮助都会令人惊叹！谢谢！

javascript是

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

    jQuery("#slidingTopBar").hide();
    jQuery(".show_hide").show();

jQuery('.show_hide').click(function(){
jQuery("#slidingTopBar").slideToggle();
});

}）;

用于触发div的html是

<div id="TopBar"><a href="#" class="show_hide">SHOW</a></div>

然后一旦div被揭示，这个div中有一个接近的div如下：

<div id="slidingTopBar"><div id="closebar"><a href="#" class="show_hide">CLOSE</a></div></div>

CSS（所有这些以防万一有这里的东西）是

#slidingTopBar
{ 
background:#199651;
display:none;
position: absolute;
height:250px;
width:100%;
left:0px;
top:0px; 
z-index:9999;
}
#TopBar{
position: absolute;
z-index: 9999;
height: 40px;
width: 40px;
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
}
#closebar{
position: absolute;
right:10px;
bottom: 10px;
width:35px;
height:35px;
z-index:9999;
background-repeat: no-repeat;
cursor: pointer;
}

实际的wordpress网站（不工作）是here（要触发的右上方按钮）

Here it is working as html file

Answer 1

我尝试了你输入的代码。我会试着通过适当的缩进为你想象它：

$.noConflict();
jQuery(document).ready(function(){
    jQuery("#slidingTopBar").hide();
    jQuery(".show_hide").show();
    jQuery('.show_hide').click(function(){
        jQuery("#slidingTopBar").slideToggle();
    });

您的准备功能缺少结束'）'。这有效：

$.noConflict();
jQuery(document).ready(function(){
    jQuery("#slidingTopBar").hide();
    jQuery(".show_hide").show();
    jQuery('.show_hide').click(function(){
        jQuery("#slidingTopBar").slideToggle();
    });
});

我认为模板仍然会允许'$'表示法，所以我会选择它。为了测试内容，您应该使用可用的开发人员工具。谷歌浏览器具有非常好的功能，可用于调试javascript和jquery。一个非常好的功能是console.log（whateveryouneedlogged）。此函数输出到开发人员工具的控制台，这意味着您可以获得传递给它的任何值。

正如@scraaappy所说，那么在运行代码之前，你还没有真正加载jquery。这对你很有帮助。同样，这会显示在Google Chrome的开发者工具中。

Answer 2

将它用于jquery的第一部分，然后它应该可以工作。

$(document).ready(function(){
  $("#slidingTopBar").click(function(){
    $(".showhide").toggle();
  });
});

Answer 3

在chrome中查看控制台（右键单击并检查元素）。你有错误。您正试图在页面中插入jquery库之前执行jquery代码。

jQuery显示/隐藏不在wordpress中工作。但在普通网站上工作正常

3 个答案: