• ベストアンサー

セレクトで選んだ数の計算方法

初心者なので基本的な質問ですが、よろしくお願いします。 セレクトで選んだ数値が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"> 5</option> <option value="9"> 9</option> </select> </form> <form name="form1"> <select size="1" name="select1" id="s1" onchange="selectChange()"> <option value="2"> 2</option> <option value="12">12</option> </select> </form> <input type="text" name="kei" size="10">  <input type="button" value="計算" onmousedown="calcNum()"> スクリプトのところだけの抜粋でわかりにくいかもしれないのですが、 どのようにしたら良いか、教えてください。 根本的に違っているようでしたら、どうやればよいのか教えてください。 よろしくお願いします

質問者が選んだベストアンサー

  • ベストアンサー
  • auty
  • ベストアンサー率58% (284/486)
回答No.1

以下のコードを参考にしてみてください。 ------------------------------------------------------------ <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">5</option> <option value="9">9</option> </select> <select size="1" name="select1" id="s1" onchange="calcNum()"> <option value="2">2</option><option value="12">12</option> </select> <hr /> 積:<input id="seki" /> </form> </body> </html>

Ruru-heart
質問者

お礼

auty様 ありがとうございました。 おかげで表示されるようになりました。 表示部など気を抜かないで最後までということですね(T-T) すぐに回答がほしいにしてあったのに、結局寝落ちしてしまい お礼が遅れてすみませんでした。 急にJavascriptをやることになって右往左往しています。 また初心者的質問をすると思いますが、よろしくお願いします。 本当に感謝です♪ありがとうございました。

すると、全ての回答が全文表示されます。

その他の回答 (1)

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.2

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"> 5</option> <option value="9"> 9</option> </select> <select size="1" name="select1" id="s1" onchange="selectChange()"> <option value="2"> 2</option> <option value="12">12</option> </select> <input type="text" name="kei" size="10">  <input type="button" value="計算" onclick="calcNum(this.form)"> </form>

Ruru-heart
質問者

お礼

yambejp様 ありがとうございました。 最初、こちらのかんたんコードを目指していたのかも^^;; ただ、別々のフォームだったため考えが粉砕したようです(T-T) どのみち表示部がいい加減ですね。 また相談させてください。 ありがとうございました。

すると、全ての回答が全文表示されます。

専門家に質問してみよう