如何在不刷新页面的情况下更新 html 中的 javascript 变量值答案

【问题标题】：How to update javascript variable value in html without a page refresh如何在不刷新页面的情况下更新 html 中的 javascript 变量值
【发布时间】：2013-07-27 17:03:03
【问题描述】：

我正在使用它的 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 测试

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

测试ID的html

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

但是在这里，每当我用新数字更新文本区域时，最终输出不会立即更新。我已经手动刷新页面以获取新值。无论如何我在不刷新页面的情况下更新值吗？

【问题讨论】：

你的jQuery在哪里，你在哪里定义了变量data？还有更多..你是怎么做到的？有点击事件？
@putvande : 'data' 是一个错字。变量是 a、b 和 c。没有点击，我想在我输入 textarea 时更新值

标签： javascript html

【解决方案1】：

如果它会在您输入输入时更新，您需要一个事件处理程序：

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

FIDDLE

【讨论】：

请注意，parseFloat 不需要1000 号码。另请注意，这不适用于粘贴或键盘以外的任何其他输入，请根据需要使用适当的事件（想到 input 事件）。
@David - input event 并没有得到广泛的支持
同意，但还有其他方法可以为旧版浏览器模拟它，f.ex 使用 setInterval。我只是提一下，以防 OP 也需要照顾贴纸。