Выполнить математику при динамическом обновлении javascript Значение

Question

Я выяснил, как обновлять свой html динамически на основе текущего ввода формы. Однако я смущен тем, как выполнять любую математику по этому значению (т.е. значение * 5) и отображать этот результат вместо простого отображения значения в форме.

Вот живой пример: 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> 

Answer 1

Чтобы получить значение х 5? Довольно просто:

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

Заканчивать этот fiddle.

Answer 2

Если я получаю то, что вы говорите правильно, то вы хотите сохранить данные элементов как переменную.

var result = this.value * 5; document.getElementById ('nameDisplay'). InnerHTML = result;

Если я неверно истолковал ваш вопрос, пожалуйста, исправьте меня.

Answer 3

Решение 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

Answer 4

Ах, теперь я вижу проблему. Очевидное решение

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"; 

в зависимости от того, что вы хотите.