'oninput'計算の結果を別のテキストボックスに表示するにはどうすればよいですか？ （HTML）

Question

私は数値を受け入れるテキストボックスをいくつか持っています。ユーザーがその中の1つに値を入力すると、計算が実行され、他のテキストボックスに表示されます（&の逆）。私はコードを使って遊んできましたが、これを持っていますが、値を表示していないようです。

<form oninput="valueB.value=valueA.value+900"> 
    <input type="number" name="valueA" value="" /> 
</form> 

<form oninput="valueA.value=valueB.value+300"> 
    <input type="number" name="valueB" value="" /> 
</form> 

私は、しかし私は、テキストボックスに値を表示するためにこれを利用すると思います方法を見ていない、結果を表示するために使用することができます<output>タグがあることに気づきます。誰かが何をすべきかアドバイスしてくれますか？

Answer 1

要素には、name属性を介してグローバル参照を指すべきではありません。 name属性をidに変更すると、予想どおりに機能することがわかります。追加を実行する前に値を数値にキャストするだけで済みます。

デモ：一般的なルールとしてhttp://jsfiddle.net/AndyE/nvQLb/

---

、あなたは別のあなたのJavaScriptとHTMLを維持し、document.getElementsByNameまたはdocument.querySelectorなどのフェッチ方法を使用して、ドキュメント内の要素を参照する必要があります。そうすれば、コードの管理が容易になり、DOM要素の名前が同じidの変数によって発生する可能性のあるあいまいさを避けることができます。