![](/img/trans.png)
[英]Html/Javascript: Is it possible to set text style.display = “none” by default?
[英]How do I make a DIV set to style.display = “none” by default?
我正在嘗試制作一個按鈕,當它被點擊時會顯示其他文本,但是,我只能制作它
這是按鈕的JS代碼:
function showInfo() { var x = document.getElementById("myDIV"); if (x.style.display === "none") { x.style.display = "block"; } else { x.style.display = "none"; } }
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/> <div id="myDIV"> Hello World </div> <button type="button" class="btn btn-primary" click="showInfo()"> Show Info </button>
有沒有辦法可以將默認 style.display 設置為 none?
您應該使用 CSS 為任何元素設置默認樣式 - 通過鏈接到外部 CSS 文件或在 Z4C4AD5FCA2E7A3F74DBB1CED00381AAZ4 文件中的開始和結束<style>
標簽之間。
像這樣
#myDIV { display: none; }
您的 JS 代碼似乎沒有問題。
反而
請更正您的 HTML,它是“點擊”而不是“點擊”
<button onclick="showInfo()">
您的處理程序是click
。 它需要是onclick
。 另外,我建議將帶有display:none
的 class 添加到您的div
中,或者簡單地內聯它,如下所示:
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<div id="myDIV" style="display: none">
Hello World
</div>
<button onclick="showInfo()">
Show Info
</button>
然后你的 JS 可以如下所示:
function showInfo() {
var x = document.getElementById("myDIV");
if (x.style.display === "none") {
return x.style.display = "block";
}
return x.style.display = "none";
}
演示
function showInfo() { var x = document.getElementById("myDIV"); if (x.style.display === "none") { return x.style.display = "block"; } return x.style.display = "none"; }
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/> <div id="myDIV" style="display: none"> Hello World </div> <button onclick="showInfo()"> Show Info </button>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.