點擊按鈕，內容隱藏，再點擊一下，然后內容又顯示了，這種效果怎么做？然后默認的是隱藏的
點擊按鈕，內容隱藏，再點擊一下，然后內容又顯示了，這種效果怎么做？然后默認的是隱藏的
qq_諾L一世相伴_0
2016-04-12
4 回答
舉報
0/150
提交
取消
2016-04-12
<!DOCTYPE html>
<html lang="en">
<head>
? ?<meta charset="UTF-8">
? ?<title></title>
</head>
<body>
? ?<h1>顯示隱藏</h1>
? ?<p id="con">
? ? ? ?做為一個Web開發(fā)師來說，如果你想提供漂亮的網頁、令用戶滿意的上網提驗，JavaScript是必不可少的工具。
? ?</p>
? ?<input type="button" onclick="hidetext()" value="不顯示段落內容"/>
? ?<input type="button" onclick="showtext()" value="顯示段落內容"/>
? ?<script>
? ? ? ?function hidetext(){
? ? ? ? ? ?document.getElementById("con").style.display="none";
? ? ? ?}
? ? ? ?function showtext(){
? ? ? ? ? ?document.getElementById("con").style.display="block";
? ? ? ?}
? ?</script>
</body>
</html>
2017-08-01
這個點擊出來的時候有點太突然，能在這個基礎上加一點緩動的效果嗎？
2016-04-13
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv = "Content-Type" content = "text/html; charset = utf-8"></meta>
<title>display演示</title>
<script type = "text/javascript">
function clk() {
var text = document.getElementById("text");
var clk_btn = document.getElementById("clk_btn");
var data = text.getAttribute('data');
if (data == 1) {
text.style.display = "none";
text.attributes["data"].nodeValue = 2;
clk_btn.attributes["value"].value = "顯示";
} else {
text.style.display = "block";
text.attributes["data"].nodeValue = 1;
clk_btn.attributes["value"].value = "隱藏";
}
}
</script>
</head>
<body>
<p id = "text" data="1">display演示文本</p>
<input id = "clk_btn" type = "button" value = "隱藏" onclick = "clk()"/>
</body>
</html>
2016-04-12
這個要點擊兩個按鈕，我要的是一個，不過我已經解決了，還是謝謝你。。
??<script type="text/javascript">
?function Show_1(){
??var mychar = document.getElementById("show1");
???? if(mychar.style.display=="block"){
??????? mychar.style.display='none';
??? }else{
??????? mychar.style.display='block';
??? }?
}
</script>
<body>
?<div><button onclick="Show_1()">快件查詢</button> </div>
?? <div id="show1" style="display:none">
??????? ?<a href="#"><img src="img/2.png" class="img1">按快件號查詢</a><br/>
??????????? <a href="#"><img src="img/2.png" class="img1">按姓名查詢</a><br/>
??????????? <a href="#"><img src="img/2.png" class="img1">按電話號查詢</a>?
?????? </div>
</body>