Jquery隐藏/显示奇怪的故障

时间:2012-02-21 20:15:28

标签: javascript jquery html css hide

这对jsfiddle来说会更容易,但是因为上帝是我的见证jsfiddle有问题,我的js都没有工作,但是他们在我的本地主机上工作但是是的。是的。

让我解释一下 我有一个名为topBar的div。 它隐藏在dom负载上。我有一个叫做toggle_bar的div 单击toggle_bar时,jquery会隐藏toggle_bar并显示topBar

但我遇到的问题是,在我点击toggle_bar后,会显示topBar,但我移动了我的鼠标和BAM! topBar消失了。 我不知道为什么会发生这种情况

这是我的代码 Jquery的

$("#topBar").hide();

$("#toggle_bar").live("click",function (){
   $("#toggle_bar").hide();
   $("#topBar").show();
});

HTML

    <div class='toggle_bar'>
        <a href='' id="toggle_bar" class="toggle_bar_class"></a>
    </div>
<div id="topBar" class="topBar" >
    <div class="bar_frame">
        <div class="plogo">
           Page logo bla bla bla
        </div>
        <div class="controls">
          Notifications bla bla bla
        </div>
        <div class="nav_bar_frame">
        <div class="float_left_bar"> 
        </div>
        <div class="float_right_bar">
        </div>
</div>
    </div>
</div>

PS:对于toggle_bar:a,我用css将图像设置为href。 :d

5 个答案:

答案 0 :(得分:2)

href上的toggle_bar应该有#,或者您应该在click处理程序中停止该事件。

答案 1 :(得分:1)

您是否有理由隐藏加载而不是设置为在样式中不显示?

OriginalSyn是对的,你可以这样写......

$("#toggle_bar").live("click",function () {
    $(this).hide();
    $("#topBar").show();
    return false;
});

答案 2 :(得分:1)

我建议(如果你使用最新版本的jQuery来使用.on()或.delegate()方法代替.live()方法。我会推荐你​​{{3}这很好地解释了这些差异。

答案 3 :(得分:0)

继承人工作fiddle。你也应该使用

.on

而不是

.live

deprecated as of 1.7.

答案 4 :(得分:0)

您似乎需要阻止链接转到网址。以下是如何更改单击事件处理程序以执行此操作的示例。

http://jsfiddle.net/dp3T2/

$("#toggle_bar").live("click",function (e){
  $("#toggle_bar").hide();
  $("#topBar").show();
  e.preventDefault();
});