将两个输入与JavaScript相乘并在文本框中显示

Question

我是新来的JavaScript和正在寻找一些帮助做两个数的简单乘法和显示结果的另一个文本框.我一直试图让这个工作几天无济于事:(

这里是基本的HTML以及JavaScript和这里的小提琴链接http://jsbin.com/egeKAXif/1/edit

我究竟做错了什么？

我想写将至少有12行的程序,我将如何扩展的JavaScript/HTML,以适应这一点？每个输入标识符都需要是唯一的吗？

任何帮助赞赏:)

    <table width="80%" border="0">
    <tr>
        <th>Box 1</th>
        <th>Box 2</th>
        <th>Result</th>
    </tr>
    <tr>
        <td><input id="box1" type="text" /></td>
        <td><input id="box2" type="text" onchange="calculate()" /></td>
        <td><input id="result" /></td>
    </tr>

    </table>

<script>

    function calculate() {
    var myBox1 = document.getElementById('box1').value; 
    var myBox2 = document.getElementById('box2').value;
    var result = document.getElementById('result'); 
    var myResult = box1 * box2;
    result.innerHTML = myResult;

}
</script>

Answer 1

你需要改变的第一件事是乘法线.它应该是:var myResult = myBox1 * myBox2;

您不应该将innerHTML与输入字段一起使用 - 使用值.

除此之外,onchange仅当输入失去焦点时才会触发事件.您可能想要使用该oninput事件.

看看工作示例:http://jsbin.com/OJOlARe/1/edit