jquery show hidden div

首先，我有点不好意思询问这个问题，所以很多人已经问过这个问题，但即使经过这么多帖子后，我也无法实现我想要的。基本上，最初隐藏的div必须在点击按钮上显示。jquery show hidden div

我试图隐藏使用display:none和hide()股利，然后使用show()，toggle()，并且css("display","block")显示它。使用上述各种组合，我仍然无法得到结果。

代码：

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<link href="css/smoothness/jquery-ui-1.9.2.custom.min.css" rel="stylesheet" type="text/css" /> 
<script src="jQuery/jquery-1.8.3.min.js" type="text/javascript"></script> 
<script src="jQuery/jquery-ui-1.9.2.custom.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#one').hide(); 
     $('#Button1').click(function() { 
      $('#one').toggle(500); 
     });   
    }); 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div id="one" style="height: 20px;width:200px; background-color: Red; ">  
</div> 
<asp:Button ID="Button1" runat="server" Text="Show" /> 
</form> 
</body> 
</html>

在按一下按钮，显示了一个简短的第二次股利再次消失之前。

如果我在上面的代码中使用show()而不是toggle()，会发生同样的情况。

再次，如果我设置style="display:none"到div而不是使用hide()，然后同样的事情用show()或toggle()。

我也尝试过使用$('#one').css("display","block");但是再次，结果相同。

任何人都可以请告诉我我哪里出错了。刚开始学习jQuery的时候，看起来如此简单的东西无法正常工作时，真的很让人沮丧。

在此先感谢。 :)

来源

2012-12-07 Fahad

由于您使用的按钮，button类型作为具有type="submit"浏览器中呈现asp:Button，所以使用return false;为

$(document).ready(function() { 
     $('#one').hide(); 
     $('#Button1').click(function() { 
      $('#one').toggle(500); 
      return false; 
     });   
    });

来源

2012-12-07 11:12:47 Usman

您提交表单，并重新加载页面，按钮元素的默认类型是提交，你可以尝试使用事件对象的preventDefault方法或按钮的类型属性设置为button。

$(document).ready(function() { 
    $('#one').hide(); 
    $('#Button1').click(function(e) { 
     e.preventDefault(); 
     $('#one').toggle(500); 
    });   
});

来源

2012-12-07 11:06:47 undefined

jquery show hidden div

回答

相关问题