我已經想出瞭如何根據表單的當前輸入動態更新我的html。然而，我對如何對這個值執行任何數學（即數值* 5）並且顯示那個結果感到困惑，而不是僅僅在表單中顯示數值。對動態更新javascript執行數學運算值

這是一個活生生的例子：https://dl.dropboxusercontent.com/u/14749627/happy2/number.html

這裏是我的javascript：

<script> 
window.onload = function() { 

var purchase_quantity = document.getElementById('purchase_quantity'); 
purchase_quantity.onclick = updateNameDisplay; 
purchase_quantity.onclick = updateNameDisplay; 
purchase_quantity.onclick = updateNameDisplay; 
function updateNameDisplay() { 
    document.getElementById('nameDisplay').innerHTML = this.value || "1"; 
} 
}; 
</script>

來源

2013-08-20 alpswd

爲什麼你重複'purchase_quantity.onclick = updateNameDisplay;'？ – Oriol

您是否試過'document.getElementById（'nameDisplay'）。innerHTML = this.value * 5 || 「1」;'？ – Oriol

爲了讓您的值×5？很簡單：

document.getElementById('nameDisplay').innerHTML = this.value * 5 || "1"; 
                ^^^^^^^^^^^^^^

看看這個fiddle。

來源

2013-08-20 02:49:50 federicot

如果我得到你說的正確，那麼你想要將元素數據存儲爲一個變量。

var result = this.value * 5; document.getElementById（'nameDisplay'）。innerHTML = result;

如果我誤解了你的問題，請糾正我。

來源

2013-08-20 02:54:29 Joshua

或者你可以像@Campari所建議的那樣做。我爲你投票，但我沒有足夠的聲譽，只是加入。 – Joshua

Campari的解決方案有效，但您應該將其明確轉換爲數字作爲一種好習慣。如果tried to add instead，它不會按預期工作。另外，感謝Oriol指出另一個問題。

var purchase_quantity = document.getElementById('purchase_quantity'); 
purchase_quantity.onclick = updateNameDisplay; 

function updateNameDisplay() { 
    document.getElementById('nameDisplay').innerHTML = 
     this.value.length ? Number(this.value) * 5 : "1"; 
}

demo

來源

2013-08-20 02:54:49 FakeRainBrigand

啊，現在我明白了這個問題。顯而易見的解決方案

document.getElementById('nameDisplay').innerHTML = this.value*5 || "1";

不起作用，因爲如果this.value是"0"，然後"0"*5是0，這是falsy，所以"1"而是返回。

然後，您可以使用類似

document.getElementById('nameDisplay').innerHTML = (this.value || "1") * 5;

或

document.getElementById('nameDisplay').innerHTML = this.value ? this.value*5 : "1";

取決於你想要什麼。

來源

2013-08-20 02:55:49 Oriol

對動態更新javascript執行數學運算值

回答

demo

相關問題