- ベストアンサー
セレクトで選んだ数の計算方法
初心者なので基本的な質問ですが、よろしくお願いします。 セレクトで選んだ数値が2つあり、その積を表示したいのです。 どうしたらよいでしょうか。 </script> <script langauage="JavaScript"> <!-- function calcNum(){ var num1 = parseInt(document.getElementById('s1').value); var num2 = parseInt(document.getElementById('s2').value); var kei = num1 * num2; } //--> </script> </head> <body> <form name="form1"> <select size="1" name="select2" id="s2" onchange="selectChange()"> <option value="5"> ５</option> <option value="9"> ９</option> </select> </form> <form name="form1"> <select size="1" name="select1" id="s1" onchange="selectChange()"> <option value="2"> ２</option> <option value="12">１２</option> </select> </form> <input type="text" name="kei" size="10"> <input type="button" value="計算" onmousedown="calcNum()"> スクリプトのところだけの抜粋でわかりにくいかもしれないのですが、 どのようにしたら良いか、教えてください。 根本的に違っているようでしたら、どうやればよいのか教えてください。 よろしくお願いします
- Ruru-heart
- お礼率100% (2/2)
- JavaScript
- 回答数2
- ありがとう数4
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
以下のコードを参考にしてみてください。 ------------------------------------------------------------ <html> <head> <script language="JavaScript"> <!-- function calcNum(){ var num1 = parseInt(document.getElementById('s1').value); var num2 = parseInt(document.getElementById('s2').value); var kei = num1 * num2; document.getElementById('seki').value = kei; } window.onload = calcNum; //--> </script> </head> <body> <form name="form1"> <select size="1" name="select2" id="s2" onchange="calcNum()"> <option value="5">５</option> <option value="9">９</option> </select> <select size="1" name="select1" id="s1" onchange="calcNum()"> <option value="2">２</option><option value="12">１２</option> </select> <hr /> 積：<input id="seki" /> </form> </body> </html>
その他の回答 (1)
- yambejp
- ベストアンサー率51% (3827/7415)
formに名前をつけるのは非推奨 別々のformでなく、一つのformの中にあるのであれば オブジェクトわたししてやれば単純な構造で汎用性があるものになりますね <script> function calcNum(f){ var num1 = parseInt(f["select1"].value); var num2 = parseInt(f["select2"].value); var kei = num1 * num2; f["kei"].value=kei; } </script> </head> <body> <form> <select size="1" name="select2" id="s2" onchange="selectChange()"> <option value="5"> ５</option> <option value="9"> ９</option> </select> <select size="1" name="select1" id="s1" onchange="selectChange()"> <option value="2"> ２</option> <option value="12">１２</option> </select> <input type="text" name="kei" size="10"> <input type="button" value="計算" onclick="calcNum(this.form)"> </form>
お礼
yambejp様 ありがとうございました。 最初、こちらのかんたんコードを目指していたのかも^^;; ただ、別々のフォームだったため考えが粉砕したようです(T-T) どのみち表示部がいい加減ですね。 また相談させてください。 ありがとうございました。
お礼
auty様 ありがとうございました。 おかげで表示されるようになりました。 表示部など気を抜かないで最後までということですね(T-T) すぐに回答がほしいにしてあったのに、結局寝落ちしてしまい お礼が遅れてすみませんでした。 急にJavascriptをやることになって右往左往しています。 また初心者的質問をすると思いますが、よろしくお願いします。 本当に感謝です♪ありがとうございました。