如何在没有页面刷新的情况下更新html中的javascript变量值

时间:2013-07-27 17:03:04

标签: javascript html

我正在使用其id到javascript变量收集文本区域值(十进制数),添加另一个变量值(十进制数),并在同一个html页面中显示结果

文本区域代码:

<div class="input-resp"><span><input  class="textbox" id="num" name="count" type="text" size="5" maxlength="3"  value="" /></span></div>

将值传递给var并将其添加到另一个var

var a = document.getElementById('num').value;
var b = 1000;
var c = parseFloat(a) + parseFloat(b); 

将var c传递给div id test

document.getElementById("test").innerHTML = c;

html for test id

<div id="test"></div>

但是在这里,每当我用新号码更新文本区域时,最终输出都不会立即更新。我手动刷新页面以获得新值。无论如何我在没有页面刷新的情况下更新了值吗?

1 个答案:

答案 0 :(得分:3)

如果在输入输入时它会更新,则需要一个事件处理程序:

document.getElementById('num').onkeyup = function() {
    var a = 1000 + parseFloat(this.value);
    document.getElementById("test").innerHTML = a || 0;
}

FIDDLE