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

回答

相關問題