3

我对此完全不知所措。我已将 $ 更改为 jQuery，我尝试使用 noConflict，我尝试使用切换命令、href onClick，现在只是尝试了显示/隐藏方法，但在这个主题中似乎没有任何效果。我禁用了所有插件，这也没有帮助。该站点已经在加载 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 中就会有一个 close 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 站点（不工作）在这里（要触发的右上角按钮）

在这里它作为html文件工作

4

3 回答 3

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 的开发人员工具中。

于 2013-08-11T22:30:44.873 回答
0

将它用于您的 jquery 的第一部分，那么它应该可以工作。

$(document).ready(function(){
  $("#slidingTopBar").click(function(){
    $(".showhide").toggle();
  });
});
于 2013-08-11T22:26:09.573 回答
0

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

于 2013-08-11T22:26:52.700 回答