js按鈕沒有更新innerhtml

我已經看過很多問題已經在這裏，我一直沒能找到類似的問題。我試圖給按鈕一個更新變量的功能（具體地說是一個數字，即 - 按鈕按>>0變成1），並將它寫到div的innerHTML。它在警報中更新，但不會更新innerHTML。js按鈕沒有更新innerhtml

var example = 0; 
var exampleDiv = document.getElementById('exampleDiv'); 

function buyExample() { 
    example += 1; 
} 

exampleDiv.innerHTML = 'You have ' + example + ' examples.';

網頁上顯示的數字是0

來源

2017-07-31 Rory L.

你能提供你的HTML代碼？ – wahdan

你可能想'exampleDiv.innerHTML = ...'在'buyExample'函數中，但是你還沒有真正地分享足夠的代碼給任何人以確定。 – smarx

您必須提供整個代碼才能確定，但您無法期望該示例僅在您添加了「示例」的情況下更新了Div.innerHTML。最有可能的是，您還必須在buyExample（）函數內設置exampleDiv.innerHTML。 –

工作代碼：

var example = 0; 
 
var exampleDiv = document.getElementById('exampleDiv'); 
 

 
function buyExample() { 
 
    example += 1; 
 
    exampleDiv.innerHTML = 'You have ' + example + ' example' + (example !== 1 ? 's' : '') + '.'; 
 
} 
 

 
document.getElementById("incrementButton").onclick = buyExample;

<button id="incrementButton">Click me</button> 
 

 
<div id="exampleDiv">You have 0 examples.</div>

來源

2017-07-31 21:18:09 smarx

因爲exampleDiv.innerHTML只設置一次你的代碼不能正常工作。您必須將其移至該功能。

var example = 0; 
 
var exampleDiv = document.getElementById('exampleDiv'); 
 
render(); 
 

 
function buyExample() { 
 
    example += 1; 
 
    render(); 
 
} 
 

 
function render() { 
 
    exampleDiv.innerHTML = 'You have ' + example + ' examples.'; 
 
}

<button id="button" onclick="buyExample()">Button</button> 
 

 
<div id="exampleDiv"></div>

來源

2017-07-31 21:17:06

從你給的情況下，你的發言：

exampleDiv.innerHTML = 'You have ' + example + ' examples.';

當JavaScript的初始化，此時例子變量仍只運行一次設置爲0.如果您希望div在每次使用按鈕時都進行更新，那麼它也需要包含在方法buyExample（）中。基於以上我的評論

function buyExample() { 
    example += 1; 
    exampleDiv.innerHTML = 'You have ' + example + ' examples.'; 
}

來源

2017-07-31 21:17:30

你必須移動，更新的DOM到每個按鈕被點擊時運行該函數的聲明。您擁有它的方式是，innerHTML在頁面加載時設置一次，並且變量example在每次點擊時得到更新，但您從不再將example的值設置爲頁面。

var example = 0; 
 
var exampleDiv = document.getElementById('exampleDiv'); 
 

 
function buyExample() { 
 
    example += 1; 
 
    exampleDiv.innerHTML = 'You have ' + example + ' examples.'; 
 
}

<div id="exampleDiv">You have 0 examples.</div> 
 
<button onclick="buyExample()">buy</button>

來源

2017-07-31 21:19:11 Will

js按鈕沒有更新innerhtml

回答

相關問題