• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:異なるフォームから呼び出したfunctionの計算をしたい)

異なるフォームから呼び出したfunctionの計算方法

このQ&Aのポイント
  • 異なるフォームから呼び出したfunctionを使用して、各フォームの計算結果を合算する方法を教えてください。
  • 4つのフォームに含まれる呼び出しを個別に計算し、最後にそれらの結果を総合計算する方法を教えてください。
  • HTMLのフォーム名と関数名に注意しながら、各フォームの小計を計算し、それらを合算して総合計を出す方法を教えてください。

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

  • ベストアンサー
noname#84373
noname#84373
回答No.1

vat total=0; function sougoukei(){ keisan1(document.getElementById('frm1')); keisan2(document.getElementById('frm2')); keisan3(document.getElementById('frm3')); keisan4(document.getElementById('frm4')); ここから各小計をたして総合計を出す } 各フォームには <form id="frm1">としてidをふる 各 keisan?()の関数の中で小計が計算できたら total+=小計額; で加算する ということで total に合計が代入!

umadura4747
質問者

お礼

できました! 何度も回答ありがとうございます 全部きちんと動いたときには 感動しました ありがとうございます またご縁がありましたら これに懲りずよろしくお願いします

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

その他の回答 (6)

noname#84373
noname#84373
回答No.7

どうかしてる!<俺 合計が正しく表示されなかった。;_; <html> <body> <div id="a"> <form id="frm1"> 1.<input type="text" class="chknum keta3 pr"><br> 2.<input type="text" class="chknum keta3 pr"><br> 3.<input type="text" class="chknum keta3 pr"><br> 4.<input type="text" class="chknum keta3 pr"><br> G.<input type="text" class="chknum keta3 shoukei"> <input type="button" value="計算" onclick="shoukei(this.form)"> </form> <form id="frm2"> 1.<input type="text" class="chknum keta3 pr"><br> 2.<input type="text" class="chknum keta3 pr"><br> 3.<input type="text" class="chknum keta3 pr"><br> 4.<input type="text" class="chknum keta3 pr"><br> G.<input type="text" class="chknum keta3 shoukei"> <input type="button" value="計算" onclick="shoukei(this.form)"> </form> </div> <form> <input type="text" id="go"> <input type="button" value="計算" onClick="goukei()"> </form> <script> var total=0; function shoukei(f){ var o=f.elements, m=o.length, k=0; for(var i=0;i<m;i++){ if(o[i].className.match(/chknum/)) if(o[i].value.match(/[^,\d,]/)) {alert('不正');return; } if(o[i].className.match(/pr/)) k+=(o[i].value.replace(/,/g,'')-0); if(o[i].className.match(/keta3/)) o[i].value=co3(o[i].value); if(o[i].className.match(/shoukei/)) { o[i].value=co3(k); total+=(k-0);} } } function goukei(){ total=0; var fm=document.getElementById('a').getElementsByTagName('form'),m=fm.length; for(i=0;i<m;i++) shoukei(fm[i]); document.getElementById('go').value=co3(total); } function co3(s){var n=new String(s).replace(/,/g,'');while(n!=(n=n.replace(/^(-?\d+)(\d{3})/,'$1,$2')));return n;} </script> </body></html>

全文を見る
すると、全ての回答が全文表示されます。
noname#84373
noname#84373
回答No.6

FRM.hk5.value = ttl-(FRM.hk2.value*2); この処理が抜けてた! しかも何のためなのかわかりません。

全文を見る
すると、全ての回答が全文表示されます。
noname#84373
noname#84373
回答No.5

<form id="frm2"> だね~。たびたび訂正。 どうも朝は頭がまわらん!

全文を見る
すると、全ての回答が全文表示されます。
noname#84373
noname#84373
回答No.4

訂正12行目<form id"=frm2"> 本当はidを振らなくても計算してるけどね・・

全文を見る
すると、全ての回答が全文表示されます。
noname#84373
noname#84373
回答No.3

<html> <body> <div id="a"> <form id"=frm1"> 1.<input type="text" class="chknum keta3 pr"><br> 2.<input type="text" class="chknum keta3 pr"><br> 3.<input type="text" class="chknum keta3 pr"><br> 4.<input type="text" class="chknum keta3 pr"><br> G.<input type="text" class="chknum keta3 shoukei"> <input type="button" value="計算" onclick="shoukei(this.form)"> </form> <form id"=frm1"> 1.<input type="text" class="chknum keta3 pr"><br> 2.<input type="text" class="chknum keta3 pr"><br> 3.<input type="text" class="chknum keta3 pr"><br> 4.<input type="text" class="chknum keta3 pr"><br> G.<input type="text" class="chknum keta3 shoukei"> <input type="button" value="計算" onclick="shoukei(this.form)"> </form> </div> <form> <input type="text" id="go"> <input type="button" value="計算" onClick="goukei()"> </form> <script> var total=0; function shoukei(f){ var o=f.elements, m=o.length, k=0; for(var i=0;i<m;i++){ if(o[i].className.match(/chknum/)) if(o[i].value.match(/[^,\d,]/)) {alert('不正');return; } if(o[i].className.match(/pr/)) k+=(o[i].value.replace(/,/g,'')-0); if(o[i].className.match(/keta3/)) o[i].value=co3(o[i].value); if(o[i].className.match(/shoukei/)) o[i].value=co3(k); total+=k; } } function goukei(){ total=0; var fm=document.getElementById('a').getElementsByTagName('form'),m=fm.length; for(i=0;i<m;i++) shoukei(fm[i]); document.getElementById('go').value=co3(total); } function co3(s){var n=new String(s).replace(/,/g,'');while(n!=(n=n.replace(/^(-?\d+)(\d{3})/,'$1,$2')));return n;} </script> </body></html>

全文を見る
すると、全ての回答が全文表示されます。
noname#84373
noname#84373
回答No.2

vat total; function sougoukei(){ total=0; 各処理.. } でも短いプログラムが好きな俺としては、長いかな~ 小計の計算サブルーチンは、工夫すると1つでまかなえると思ふ。 name は使わず id を!

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

関連するQ&A

  • ファンクションで計算する

    <SCRIPT language="JavaScript">  function changeArariYosan() {   sum();  }  function sum() {   var sumArariYosan = 0;   var lstArariYosan = document.form.elements("_arariYosan");  for(i = 0 ; lstArariYosan.length > i ; i ++ ){   if(lstArariYosan[i].value.replace(",","") == "" |   isNaN(lstArariYosan[i].value.replace(",",""))){ sumArariYosan = 0; break;   }   sumArariYosan += parseInt(lstArariYosan[i].value.replace(",",""),10);//予算(売上) }  document.form.elements("_sumArariYosan").value = addComma(sumArariYosan.toString());  } /*addCommaは、カンマ編集のメソッド*/ bodyの中でこういう記述があります。 <html:text disabled="true" property="_arariYosan" styleClass="hankaku_right_text" onchange="changeArariYosan()" value="${Line.荒利予算}" /> DBより抽出した値で計算をするんですが、 この荒理予算の部分をvalue="1000"にすると きちんと計算を行ってくれます。 しかし、上記の様にDBから抽出する記述に変更すると 計算ができず、0の値が返ってきてしまうのです。 何がいけないのでしょうか?

  • 型変換を行った後で計算をする方法

    DBには、テキスト型で保存している数字があります。 それをJSP側でINT型に変換して、 計算を行いたいのですが、何か良い方法はありませんか? 下記のままだと常に0が表示されてしまいます。 どうか良いアドバイスをお願いします。 function changeYosan() {  var lstYosan = document.form.elements("_uriageYosan");  var lstJisseki = document.form.elements("_uriageJisseki");  var lstNobi = document.form.elements("_nobiritsu"); for(i = 0 ; lstYosan.length > i ; i ++ ){   lstNobi[i].value = lstYosan[i].value.replace(",","") /     lstJisseki[i].value * 100; if(isNaN(lstNobi[i].value)){   lstNobi[i].value = 0; } } }

  • 自動計算をIEとFireFoxで動かすには?

    いつもお世話になっています。 フォームに入力した値を10で割った数を答えを自動で計算して、別フォームに出力する部分で、FireFoxでは自動計算されるのですがIEでは計算が行われませんでしたx_x; 【ソース】******************************* <script type="text/javascript"> <!-- function keisan(){ // 設定開始 // 商品1 var price1 = document.form1.goods1.value / 10; // 単価を設定 document.form1.field1.value = price1; // 小計を表示 // 合計を計算 var total = price1; // 設定終了 document.form1.field_total.value = total; // 合計を表示 } *********************************** 解決方法をご教授頂けたら幸いです。 何卒よろしくお願い致します。

  • 計算結果を変数に代入

    とあるサービスの料金計算フォームを制作しています。 特定の場合のみ料金が割引されるので、if構文で条件分岐してみたところ、 計算結果(小計)にはうまく反映されるのですが、いくつかの小計を合計すると、 if構文で分岐する前の(つまり割り引き前の)値段で計算されてしまいます。 // 小計1 var total_01 = document.form_test.price_01.options [document.form_test.price_01.selectedIndex].value * document.form_test.goods_01.options [document.form_test.goods_01.selectedIndex].value + document.form_test.price_02.options [document.form_test.price_02.selectedIndex].value * document.form_test.goods_02.options [document.form_test.goods_02.selectedIndex].value ; // 小計1 document.form_test.F-total_01.value = total_01; // 小計1を表示 if (document.form_test.price_01.options [document.form_test.price_01.selectedIndex].value != 0 && document.form_test.price_02.options [document.form_test.price_02.selectedIndex].value != 0) {document.form_test.F-total_01.value = total_01 - 500;} // 両方で-500 if (total_01 <= 0) {document.form_test.F-total_01.value = 0;} // 合計 var total_all = total_01 + total_02 + total_034; // 合計 document.form_test.F-total_all.value = total_all; // 合計を表示 小計を表示する <INPUT TYPE="text" NAME="F-total_01" VALUE="0"> に出てきた値を、そのまま次の計算に代入できれば 解決するのではないかと思うのですが、行き詰ってしまいました。 どうかアドバイスをよろしくお願いいたします。

  • javascriptの入力制限keycode除く

    はじめまして javascript初心者です テキストエリアに数字のみ入力できるようにしたいと思い 以下のとおりソースを記述しました function numCheck(){ var num = document.frm.txt.value; var cnum = num.replace(/[^0-9]/,""); num = cnum; document.frm.txt.value = num; <form name = "frm"> <input type="text" onkeypress="numCheck()" value="txt"> </form> キーコードによる入力制限は考えません あと何が足りないでしょうか? よろしくご教授くださいm(__)m

  • html:計算フォームを組み込みフォーム作成したい

    htmlのフォームで、計算フォーム(掛け算)を組み込んだフォームを作成したいです。 ◆◆◆単価 * ■■■数量 = 合計額☆☆☆ 単価の◆は予めサイト側で指定 数量の■はページ閲覧者の 任意入力 合計額の☆☆☆ は 自動で計算された答えが出力される <html> <head> <title>TAG index Webサイト</title> <style type="text/css"> <!-- table { border-collapse: collapse; } table, th, td { border: 1px #808080 solid; } th, td { padding: 3px 10px; } th { background-color: #d3e9fa; } td { background-color: #ffffff; } td strong { color: #ff0000; } --> </style> <script type="text/javascript"> <!-- function keisan(){ // 設定開始 // 商品1 var price1 = document.form1.goods1.selectedIndex * 500; // 単価を設定 document.form1.field1.value = price1; // 小計を表示 // 商品2 var price2 = document.form1.goods2.selectedIndex * 1000; // 単価を設定 document.form1.field2.value = price2; // 小計を表示 // 商品3 var price3 = document.form1.goods3.selectedIndex * 3000; // 単価を設定 document.form1.field3.value = price3; // 小計を表示 // 合計を計算 var total = price1 + price2 + price3; // 設定終了 document.form1.field_total.value = total; // 合計を表示 } // --> </script> </head> <body> <form action="#" name="form1"> <table> <tr> <th>商品名</th> <th>単価</th> <th>数量</th> <th>金額</th> </tr> <tr> <td>商品サンプル1</td> <td align="right">500円</td> <td><select name="goods1" onChange="keisan()"> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select></td> <td><input type="text" name="field1" size="8" value="0"> 円</td> </tr> <tr> <td>商品サンプル2</td> <td align="right">1,000円</td> <td><select name="goods2" onChange="keisan()"> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select></td> <td><input type="text" name="field2" size="8" value="0"> 円</td> </tr> <tr> <td>商品サンプル3</td> <td align="right">3,000円</td> <td><select name="goods3" onChange="keisan()"> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select></td> <td><input type="text" name="field3" size="8" value="0"> 円</td> </tr> <tr> <td align="right" colspan="3"><strong>合計</strong></td> <td><input type="text" name="field_total" size="8" value="0"> 円</td> </tr> </table> </form> </body> </html> 上記のテンプレートを参考にさせていただきましたが、このテンプレートだと数値が1~5までしか 選択できません。好きな数字を任意入力できるようにしたいです。  計算結果がすぐに表示されるのは嬉しいですが、 この内容と合わせて更に ・お名前 □□□□ ・連絡先メールアドレス □□□□  これらの要素を、送信ボタンを押して xyz@abcde.co.jpに 内容が届くようにしたいです。 ●送信● ●リセット● の2つのボタンを配置 (送信ボタンを押すと、xyz@abcde.co.jpに以上の項目が記載されたメールが届くようにする) (リセットを押すと入力されたフォームの数値がリセットされる) <p> <input type="submit" value="送信する"> <input type="reset" value="リセット"> </p> 上記の内容を入力することで 送信する/リセット のボタンを作ることはできましたが、 例えばabc@xyz.co.jpに 入力された項目すべてを送信するには 送信する ボタンの後にハイパーリンクを使えばよいのでしょうか。 お手数ですが、ご指南お力添えの程、よろしくお願いしますm(_ _)m

  • ブラウザ上のテキストボックスから数値を受け取って別のテキストボックスに計算結果を返す

    超初心者です。 Cの勉強をしていたのですが、javascriptにも手を出してみました。 変数の考え方が違うせいか、理解が間違っているのか・・・ ブラウザ上でテキストボックスに数値を記入して、別なテキストボックスに計算結果を返すソースを考えていました。 以下のような感じです。 HTML ------------------------ <form> 林檎 100円 * <input type=text name=txt7>個  <input type=button value="計算" onClick="func4(txt7)"><br> 合計金額は<input type=text name=txt8>円になります。 </form> ------------------------- JS ------------------------ function func4(keisan){ document.form2.txt8.value=keisan*100; } ------------------------ 上記のように変数を使うとエラーになります。「NaN」が返ってきます。 変数を使用せずに、直接受け取る値を計算すれば出来たのですが・・・ ブラウザからなにかを入力させ、それを変数に代入した場合は数値(INT)型にはならないのでしょうか?? 詳しい方、解説をお願いします・・・

  • java 計算フォームで未入力の場合ゼロとしたい

    java を使ってweb上で計算フォームを作成しています フォームに数値が入力された場合は問題なく計算結果に反映できますが、未入力のフォームがあると計算結果が反映されません。 未入力のフォームはゼロの値として計算結果を反映させたいのですが、どうしてもできなかったのでお力をお貸頂ければ助かります>< フォームに最初からゼロの値を入れておく方法もあるのですが、ゼロが消された場合は未入力となってしまい計算結果に反映されないので、あくまで未入力の場合はゼロとして計算結果に反映させたいと思っています。 [script LANGUAGE="JavaScript"] function calc() { var s1, s2, s3, s4, ss; s1 = eval(document.form01.txt01.value); s2 = eval(document.form01.txt02.value); s3 = eval(document.form01.txt03.value); ss = s1+s2 +s3; if(ss < 30000) document.form01.txt04.value = ss*0.3; else if(s5 >= 30000) document.form01.txt04.value = ss*0.5; } [/script] <form name="form01"> <input style= type="TEXT" name="txt01" /> <input style= type="TEXT" name="txt02" /> <input style= type="TEXT" name="txt03" /> <input onclick="calc()" type="button" value="計算する" /> <input style= type="TEXT" name="txt04" /> </form> よろしくお願いします

  • jacascriptとフォームselectメニューで計算した値を保存したい

    お世話になります。 javascriptを使った計算を勤め先で必要ということで、社内で少しパソコンに詳しいという理由で自分が手がけることになりましたorz 色々と検索しながら勉強し、ようやく思い通りのプログラムを見つけて参考にしながら実践してみたのですが、思い通りにならない箇所が一部ありまして困っています。 参考にしたのは以下のサイトなのですが、 ttp://www.tagindex.com/javascript/form/comp1b.html セレクトメニューから選んだ値を特定の数値で掛けそれを合計するという流れなのですが、このスクリプトだと、一度計算を終えると、もう一度セレクトメニューから値を選択しないと値が0になってしまっているのです。 希望としては、この選択した値を保存しておき、計算が終わってもそれ以前の選択状況のままにしておきたいんですが、どうやればできるでしょうか? <script type="text/javascript"> <!-- function keisan(){ // 設定開始 // 商品1 var price1 = document.form1.goods1.selectedIndex * 500; // 単価を設定 document.form1.field1.value = price1; // 小計を表示 // 商品2 var price2 = document.form1.goods2.selectedIndex * 1000; // 単価を設定 document.form1.field2.value = price2; // 小計を表示 // 商品3 var price3 = document.form1.goods3.selectedIndex * 3000; // 単価を設定 document.form1.field3.value = price3; // 小計を表示 // 合計を計算 var total = price1 + price2 + price3; // 設定終了 document.form1.field_total.value = total; // 合計を表示 } // --> </script> </head> <body> <form action="#" name="form1"> <table> <tr> <th>商品名</th> <th>単価</th> <th>数量</th> <th>金額</th> </tr> <tr> <td>商品サンプル1</td> <td align="right">500円</td> <td><select name="goods1" onChange="keisan()"> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select></td> <td><input type="text" name="field1" size="8" value="0"> 円</td> </tr> <tr> <td>商品サンプル2</td> <td align="right">1,000円</td> <td><select name="goods2" onChange="keisan()"> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select></td> <td><input type="text" name="field2" size="8" value="0"> 円</td> </tr> <tr> <td>商品サンプル3</td> <td align="right">3,000円</td> <td><select name="goods3" onChange="keisan()"> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select></td> <td><input type="text" name="field3" size="8" value="0"> 円</td> </tr> <tr> <td align="right" colspan="3"><strong>合計</strong></td> <td><input type="text" name="field_total" size="8" value="0"> 円</td> </tr> </table> </form>

  • 価格計算フォーム作成について

    初心者です。次のような書籍注文フォームを作成しております。 (BODYタグも必要の場合お教え下さい。) CGIは借りており、テーブルの数など変更するとうまく送信できないようです。 フォームへは、各冊数、合計冊数、送料、合計金額の順に入力できるようなっております。また、実際は、書籍(1)、(2)のみ現在使用できるようなっています。 修正しているのですが、動作が正しく動いてくれない状況です、どこを変えたら正しく動作しますでしょうか? 申し訳ありませんが、なかなか解決せずご教示いただけると嬉しいです。 以下コード↓ ------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 6.5.2.0 for Windows"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>書籍販売 メイン</TITLE> <SCRIPT language="JavaScript"> <!-- //冊数を記述(フォームを使用できるのは書籍(1)、(2)のみ。(3)~(7)は記録として残されている。) function CountBooks() { // var i1 = document.form.書籍(1).selectedIndex; // var i2 = document.form.書籍(2).selectedIndex; // var i3 = document.form.書籍(3).selectedIndex; // var i4 = document.form.書籍(4).selectedIndex; // var i5 = document.form.書籍(5).selectedIndex; // var i6 = document.form.書籍(6).selectedIndex; // var i7 = document.form.書籍(7).selectedIndex; var i1 = document.form1.elements[14].selectedIndex; var i2 = document.form1.elements[15].selectedIndex; var i3 = document.form1.elements[16].selectedIndex; var i4 = document.form1.elements[17].selectedIndex; var i5 = document.form1.elements[18].selectedIndex; var i6 = document.form1.elements[19].selectedIndex; var i7 = document.form1.elements[20].selectedIndex; //送料計算(書籍(1)(単価:300円)のみ適用。1~5冊なら160円、6冊以上なら960円。)) function GetSouryou(i1) { var iSouryou = 0; if (i1 < 1) iSouryou = 0; else if (i1<6 ) iSouryou = 160; else if (i1 < 1000) iSouryou = 960; else iSouryou = 0; } //書籍(1)の単価×冊数を計算 var ikakaku1 = document.form1.elements[14].selectedIndex; * 300; //書籍(2)の単価×冊数を計算   var ikakaku2 = document.form1.elements[15].selectedIndex; * 1000; //合計金額を計算 function GetGoukeiKinGaku(iCount,iSouryou, iKakaku1, iKakaku2) { var iGoukei = 0; iGoukei = (iSouryou * iKakaku2)+ikakaku1; iGoukei = Math.floor(iGoukei); iGoukei = Kanma(iGoukei); document.form1.elements[23].value = iGoukei; } //数値に3桁カンマを追加 function Kanma(iValue) { iValue=new String(iValue); Leng=iValue.length; if(Leng%3 == 0) Atai=Leng/3-1; else Atai=Math.floor(Leng/3); i=3; for(j=0; j<Atai; j++) { iValue=iValue.substring(0,Leng-i)+','+iValue.substring(Leng-i,Leng); Leng++; i++; i+=3; } return iValue; } //--> </SCRIPT> <STYLE type="text/css"> <!-- INPUT{ text-align : left; } .TEXT_RIGHT{ text-align : right; } .style1 {font-size: 2} --> </STYLE> </HEAD> -----------------------------------------------------------

このQ&Aのポイント
  • 7月に購入し本日使用の為カバーを持ったら損傷した
  • コンピューターミシンの糸立て棒本体のプラスチックが破損してしまいました。
  • 7月に購入したコンピューターミシンの糸立て棒本体のプラスチックが、本日使用する際にカバーを持ったら損傷しました。
回答を見る

専門家に質問してみよう