单击按钮隐藏并显示div div

问题描述：

<!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

为什么你已标记的SQL服务器，数据库，Web托管 – kritikaTalwar

添加样式= “显示：无;”到最初应该隐藏的标签 – olk

olk .. thanxx很... –

答

添加样式显示：无在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>

单击按钮隐藏并显示div div

相关推荐