我將如何創建一個顯示點擊文本的javascript按鈕

如何在點擊時使此按鈕顯示段落文本？
onClick沒有被記錄，當我單擊按鈕時我甚至看不到警報消息。我將如何創建一個顯示點擊文本的javascript按鈕

function displaySong1() { 
 
    alert("asdasf"); 
 
}

.button { 
 
    background-color: #8C6D09; 
 
    color: white; 
 
    padding: 16px 32px; 
 
    display: inline-block; 
 
    margin: 4px 2px; 
 
    -webkit-transition-duration: 0.4s; 
 
    /* Safari */ 
 
    transition-duration: 0.4s; 
 
} 
 

 
.button1 { 
 
    background-color: #8C6D09; 
 
    color: #FFF; 
 
}

<button class=".button .button1" onClick="displaySong1()">Easy</button>

來源

2017-08-04 demis

嘗試使用的onclick代替的onClick – scaisEdge

你在控制檯中的任何錯誤？警報出現在我的瀏覽器中沒有任何問題.... –

請確保將onClick更改爲onclick（全部小寫） – Ali

你只需要設定與顯示一個段落：無，並設置爲display：block當你點擊。

function displaySong1() { 
 
    var p = document.getElementById("paragraph"); 
 
    p.style.display = "block"; \t 
 
}

.button { 
 
    \t background-color: #8C6D09; 
 
    \t color: white; 
 
    \t padding: 16px 32px; 
 
    \t display:inline-block; 
 
    \t margin:4px 2px; 
 
    \t -webkit-transition-duration: 0.4s; /* Safari */ 
 
    transition-duration: 0.4s; \t 
 
} 
 
    \t 
 
.button1{ 
 
    \t background-color:#8C6D09; 
 
    \t color:#FFF;  \t 
 
} 
 

 
#paragraph 
 
{ 
 
    display:none; 
 
} 
 

 
just change display:none to display:block on the paragraph

<button class="button button1" onclick="displaySong1()">Easy</button> 
 
<div id="paragraph"> 
 
hello 
 
</div>

來源

2017-08-04 13:50:09

這裏是完整的代碼，因爲它似乎仍然不起作用： – demis

實際上，我忘記了一個分號。 –

@demis如果這個例子不適合你，問題不在js中。 – Petroff

我將如何創建一個顯示點擊文本的javascript按鈕

回答

相關問題