Question

我似乎和之前发布的问题一样。我想默认隐藏那里的所有div，只显示一个。然后，用户可以单击侧面选项卡以显示另一个。问题是div只在页面加载后隐藏了一秒钟，但很快就会重新出现。这是代码，它假设隐藏页面的div，只显示id为“pple”的div：

$("a#link2").click(function(){$("#content > div").hide(); $("#pple").show();});

markup:

   home.html:                                           
<li><a href="about.html" id="link2">About</a></li>

about.html:
<div id="content">
 <div class="tabContent" id="pple">
<p>
    Content
<p> 
   </div>

    <div class="tabContent" id="serv">

<p>
    Content
</p>    
  </div>

  <div class="tabContent" id="sol">     

<p>
    Content
</p>    
  </div>            
</div>

感谢您的回复。

Answer 1

您需要在return false;元素的处理程序上<a>。

这是因为<a>元素的默认行为正在发生并重新加载页面，因此您需要禁用该行为。

$("a#link2").click(function(){
    $("#content > div").hide(); 
    $("#pple").show();
    return false;  // Will prevent default behavior
                   //   but it also prevents event bubbling
});

或者，您可以致电event.preventDefault()

$("a#link2").click(function( event ){
    event.preventDefault();  // Prevents the default behavior
                             //    and event bubbling is still intact
    $("#content > div").hide(); 
    $("#pple").show();
});

http://api.jquery.com/event.preventdefault/

Answer 2

在div隐藏后尝试防止默认所以你可以做到 ...function(event) event.preventDefault()...

jquery hide方法只隐藏div一秒钟，然后div自动重新出现

2 个答案: