2017-02-11 265 views
0
<!DOCTYPE html> 
<html> 
<head> 
<script  src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
$("button").click(function(){ 
$("p").toggle(); 
}); 
}); 
</script> 
</head> 
<body> 

<button style="width:80%;height:35px;">Toggle between hiding and showing the  paragraphs</button> 

<p>This is a paragraph with little content.</p> 
<p>This is another small paragraph.</p> 
</body> 
</html> 

此代碼隱藏並顯示點擊按鈕上的div。 這段代碼工作正常......但我希望該div應該先隱藏。它會在點擊後顯示。單擊按鈕隱藏並顯示div div

+1

爲什麼你已標記的SQL服務器,數據庫,Web託管 – kritikaTalwar

+0

添加樣式= 「顯示:無;」到最初應該隱藏的標籤 – olk

+0

olk .. thanxx很... –

回答

1

添加樣式顯示:無在p標籤

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script> 
    $(document).ready(function(){ 
     $("button").click(function(){ 
     $("p").toggle(); 
     }); 
    }); 
</script> 
<style> 
     p{ 
      display:none; 
     } 
    </style> 
</head> 
<body> 

    <button style="width:80%;height:35px;">Toggle between hiding and showing the paragraphs</button> 

    <p>This is a paragraph with little content.</p> 
    <p>This is another small paragraph.</p> 
</body>