プログラミングにおけるフォームタグの問題点とは?

このQ&Aのポイント
  • プログラミングにおいて、FORMタグがなくても動作することがありますが、具体的な問題点を知りたいです。
  • 古い型のプログラミングではFORMタグを使用しなくても動作することがありますが、最新のプログラミングではどのような問題が生じるのか知りたいです。
  • 自分でプログラミングを作成した際にFORMタグがないと動作しない問題が発生しています。具体的な解決策を教えてください。
回答を見る
  • ベストアンサー

何がおかしいのでしょうか?

こんばんわ。これは古い型のプログラミングかもしれませんが、 講義でもやっているので、FORMタグが無くても動作はするようです。 しかし、プログラミングを自分で作ってみても全く動作しません(>_<) 具体的にどこがおかしいため動作が行われないのか、教えてください。 新しいタグを加えなくても講義では動作してますし、このまま 自分で眺めていても全く先に進みません。 よろしくお願いいたします。 <head> <title> プログラミング</title> <script language ="JavaScript" > function calc(){ sub1=798*num1.value; mug.value=sub1; sub2=748*num2.value; tea.value=sub2; sub3=1780*num3.value; teatime.value=sub3; sum=sub1+sub2+sub3; total.value=sum; sub4=3*num1.value; sub5=3*num2.value; sub6=6*num3.value; sum2=sub4+sub5+sub6; souryoupoint.value=sum2; sub7=(((souryoupoint-1) / 5) + 1)*525; souryou.value=sub7; total2.value=sub7+sum; tax.value=Math.round((sub7+sum)-(sub7+sum)/1.05); if(total<4000){post=souryou;} else if(total<7000){post=souryou/2;} else{post=souryou/3;} souryou.value=Math.floor(post); } </script> </head> <body><hr> マグカップ1ペア(2個セット)税込798円:送料ポイント=3<br> 個数: <input type="text" size="4" name="num1">&nbsp&nbsp&nbsp&nbsp 小計: <input type="text" size="8" name="mug">円<br><br> <hr> ティーカップ1セット(カップ&ソーサー)税込748円:送料ポイント=3<br> 個数: <input type="text" size="4" name="num2">&nbsp&nbsp&nbsp&nbsp 小計: <input type="text" size="8" name="tea">円<br><br> <hr> ティータイムセット 税込1780円:送料ポイント=6<br> (セット内容:ティーポット 1個&ティーカップ2セット)<br> 個数: <input type="text" size="4" name="num3">&nbsp&nbsp&nbsp&nbsp 小計: <input type="text" size="8" name="teatime">円<br><br><hr> 送料ポイント5毎に送料525円が必要となります。<br> 1~5⇒525円(税込)<br> 6~10⇒1050円(税込)<br> 11~15⇒1575円(税込) 以下、同様に計算します<br><br> サマーバーゲン実施中!<br> 送料を除き商品を4000円以上お買い上げの方は送料半額!<br> さらに、7000円以上(送料除く)お買い上げの方は送料を1/3に!!!<hr><br> <input type="button" value="計算" onclick=calc()"> &nbsp&nbsp&nbsp&nbsp&nbsp&nbspお支払い総額:<input type="text" size="8" name="total2">円&nbsp&nbsp&nbsp&nbsp うち消費税&nbsp&nbsp:&nbsp&nbsp<input type="text" size="8" name="tax">円 <br><br> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp(内訳)&nbsp&nbsp&nbsp&nbsp 商品代金:&nbsp&nbsp<input type="text" size="8" name="total">円&nbsp&nbsp /&nbsp&nbsp送料ポイント:&nbsp&nbsp<input type="text" size="8" name="souryoupoint"> ⇒送料:&nbsp&nbsp<input type="text" size="8" name="post"><br><br> <hr> </body> </html>

  • HTML
  • 回答数3
  • ありがとう数1

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

  • ベストアンサー
  • leap_day
  • ベストアンサー率60% (338/561)
回答No.3

こんにちはNo.1です あれから反応がないですね・・・思案中かな? こんな感じになると思います <script language ="JavaScript" > <!-- function calc(){ sub1=798*num1.value; mug.value=sub1; sub2=748*num2.value; tea.value=sub2; sub3=1780*num3.value; teatime.value=sub3; sum=sub1+sub2+sub3; total.value=sum; sub4=3*num1.value; sub5=3*num2.value; sub6=6*num3.value; sum2=sub4+sub5+sub6; souryoupoint.value=sum2; sub7=Math.ceil(sum2 / 5) * 525; if(sum>=7000){post0 = Math.floor(sub7/3) ;} else if(sum>=4000){post0 = Math.floor(sub7/2);} else{post0 =sub7;} post.value=post0; tax0=Math.floor((post0+sum)*0.05); tax.value=tax0; total2.value=Math.floor(post0+sum+tax0); } //--> </script> あと何で動かないかというと・・・ <input type="button" value="計算" onclick=calc()"> の部分 onclick="calc()" となります それからnameのないものにvalue値を渡したり計算させたりしている為です souryou.value=sub7; name="souryou"というtextboxがありません total,souryou,souryoupointなど souryou.value イコール souryouではないですので・・・

rinnshan
質問者

お礼

就寝中でしたm(_ _)m こんな夜遅くまで考えてくださってありがとうございました。 そうなのですが、textboxに対応するnameが絶対に必要に なるのですね。 複雑になればなるほどどこが間違っているかわからなくなって きますので、考えてくださって本当にありがとうございました。

その他の回答 (2)

  • ape5
  • ベストアンサー率57% (85/148)
回答No.2

回答にはならないですが、<form>タグがなくても動くということですが、HTMLを解釈するブラウザの種類、バージョンなどによって動作がことなることも多いですので、rinnshanさんの環境と講義で行っている環境が違えば、動作などに違いが出る可能性があります。ですので、環境の違いによって動作がちがうのか?ということを調べるのも解決の一つかもしれません。

  • leap_day
  • ベストアンサー率60% (338/561)
回答No.1

こんにちは こちらに移動したのですね(笑) 前回のjavascriptの方、回答する前に締め切られちゃったのでこちらに投稿しますね(^^) こちらの質問の方はまだ見てないですのでとりあえず前回作ったサンプル載せておきます 送料計算は Math.ceil(point/5)*525 の部分になります <script language="javascript"> <!-- window.onload = function(){ for(i=0;i<10;i++) { document.f.s1.options[i] = new Option(i,i); document.f.s2.options[i] = new Option(i,i); document.f.s3.options[i] = new Option(i,i); } } function cals() { num1 = document.f.elements[0].value; num2 = document.f.elements[1].value; num3 = document.f.elements[2].value; point = Math.floor(3*num1 + 3*num2 + 6*num3); send = Math.ceil(point/5)*525; document.f.point.value = point; document.f.send.value = send; } //-> </script> <form name="f"> 798円<select name="s1" onChange="cals()"></select> 748円<select name="s2" onChange="cals()"></select> 1780円<select name="s3" onChange="cals()"></select> <p> Point<input type="text" name="point"> 送料<input type="text" name="send">

関連するQ&A

  • 何がおかしいのでしょうか?

    プログラミング初心者なのですが、うまくJavaScriptの計算ができないようです。どのように変更すればいいのかがよくわからないです。 よろしくご指導お願いします。 <html> <head> <title> プログラミング基礎</title> <script language ="JavaScript" > function calc(){ sub1=498*num1.value; mug.value=sub1; sub2=748*num2.value; tea.value=sub2; sum=sub1+sub2; total.value=sum; } function calc(){ shouhi.value=Math.floor(total.value+735/1.05) </script> </head> <body><hr> マグカップ(1個 税込498円:お一人様限定5個まで)<br> 個数: <select name ="num1" onchange ="calc()"> <option value =0>0  <option value =1>1 <option value =2>2 <option value =3>3 <option value =4>4 <option value =5>5 <select/> &nbsp&nbsp 小計: <input type="text" size="8" name="sub1"> <br><br><hr> ティーカップ(1セット税込748円:お一人様限定5セットまで)<br> 個数: <select name ="num2" onchange ="calc()"> <option value =0>0  <option value =1>1 <option value =2>2 <option value =3>3 <option value =4>4 <option value =5>5 <select/> &nbsp&nbsp 小計: <input type="text" size="8" name="sub2"> <br><br><hr><br> 別途、送料として一律税込735円が必要になります。 <br><br><hr><br> お支払い総額: <input type="text" size="8" name="total">円 &nbsp うち、消費税額: <input type="text" size="8" name="shouhi">円 <br> <hr> </body> </html>

  • 電卓のJavaScript

    初心者で申し訳ないのですが、電卓のソースを作ってみたのですが、JavaScriptが間違っているためか「ページにエラーが発生しました」となり計算が行われません。 どのように、改変すればいいのでしょうか?どうかご教授お願いします。 <html> <head> <title> 電卓 </title> <script language = "JavaScript"> count = 0; sum= 0; flag =0; list = new Array( "0", "0","0","0","0",); function clist( ) { for( i = 0 ; i < 5 ; i++ ) { list[i] =0; } } function calc1() { num = sum; clist( ); display.value = num; flag = 1; } function calc2() { num = sum; clist( ); display.value = num; flag = 2; } function calc3() { num = sum; clist( ); display.value = num; flag = 3; } function calc4() { num = sum; clist( ); display.value = num; flag = 4; } function calc5() { clist( ); } function equal() { if(flag==1) { sum=num+sum; display.value=sum; clist( ); } else if(flag==2) { sum=num-sum; display.value=sum; clist( ); } else if(flag==3) { sum=num*sum; display.value=sum; clist( ); } else if(flag==4) { sum=num/sum; display.value=sum; clist( ); } } function push0( ) { list[count] = 0; sum = list[count]; for( i = 0 ; i < count ; i++ ) { temp=1; for( j = i ; j < count ; j++ ) { temp=temp*10; } sum+ =list[i]*temp; } count+=1; display.value=sum; } function push1( ) { list[count] = 1; sum = list[count]; for( i = 0 ; i < count ; i++ ) { temp=1; for( j = i ; j < count ; j++ ) { temp=temp*10; } sum+ =list[i]*temp; } count+=1; display.value=sum; } 同様に2~9 </script> </head> <body> <hr><br> <input type = "button" value ="7" onclick = "push7()">&nbsp <input type = "button" value ="8" onclick = "push8()">&nbsp <input type = "button" value ="9" onclick = "push9()">&nbsp&nbsp <input type = "button" value ="+" onclick = "calc1()">&nbsp<br><br> <input type = "button" value ="4" onclick = "push4()">&nbsp <input type = "button" value ="5" onclick = "push5()">&nbsp <input type = "button" value ="6" onclick = "push6()">&nbsp&nbsp <input type = "button" value ="-" onclick = "calc2()">&nbsp<br><br> <input type = "button" value ="1" onclick = "push1()">&nbsp <input type = "button" value ="2" onclick = "push2()">&nbsp <input type = "button" value ="3" onclick = "push3()">&nbsp&nbsp <input type = "button" value ="×" onclick = "calc3()">&nbsp<br><br> <input type = "button" value ="0" onclick = "push0()">&nbsp <input type = "button" value ="=" onclick = "equal()">&nbsp <input type = "button" value ="C" onclick = "calc5()">&nbsp&nbsp <input type = "button" value ="÷" onclick = "calc4()">&nbsp<br><br> <br><br><hr><br>&nbsp&nbsp&nbsp <input type = "text" size ="10" name = "display">&nbsp <br><br><hr><br> </body> </html>

  • 同じFunctionで、同じ計算させたいのですが

    私は今、以下のようにここで教えていただいたプログラムを参考に組んでは見たものの、同じ行をいくつもコピペすると計算されなくなってしまいます。1行だけの計算でしようとするとうまく計算されるのですが・・・ <HTML> <HEAD> <TITLE> タイトルバーに表示されるテキスト </TITLE> <SCRIPT LANGUAGE="JavaScript"> <!--JavaScript function SUM(){ if(!isNaN(document.sum.text1.value) && !isNaN(document.sum.text2.value) && !isNaN(document.sum.text3.value) && document.sum.text1.value && document.sum.text2.value && document.sum.text3.value){ document.sum.text4.value = eval(document.sum.text1.value) + eval(document.sum.text2.value) - eval(document.sum.text3.value) } if( !isNaN(document.sum.text5.value) && !isNaN(document.sum.text6.value) && document.sum.text5.value && document.sum.text6.value){ document.sum.text7.value = eval(document.sum.text4.value) + eval(document.sum.text5.value) + eval(document.sum.tex6.value) } } //--> </SCRIPT> </HEAD> <BODY> <FORM NAME="sum" onSubmit="SUM();return false;"> A<INPUT TYPE="text" NAME="text1" onChange="SUM()" SIZE="10"><BR> B<INPUT TYPE="text" NAME="text2" onChange="SUM()" SIZE="10"><BR> C<INPUT TYPE="text" NAME="text3" onChange="SUM()" SIZE="10"><BR> D=A+B-C<INPUT TYPE="text" NAME="text4" onChange="SUM()" SIZE="10"><BR> E<INPUT TYPE="text" NAME="text5" onChange="SUM()" SIZE="10"><BR> F<INPUT TYPE="text" NAME="text6" onChange="SUM()" SIZE="10"><BR> G=D+E+F<INPUT TYPE="text" NAME="text7" onChange="SUM()" SIZE="10"><BR> </FORM> </BODY> </HTML>

  • javascriptでフォームの値の計算

    javascript1か月目の初心者です。 7つのテキストフィールドに数値を代入させて合計と平均(最後には標準偏差)を計算しようと思ってます。 以下のように考えましたが、うまくいきません。 strが文字列として?扱われてしまっているようです。 strをevalで囲んでみてもダメです。 詳しい方教えてください。 <!--スクリプト1--> <SCRIPT LANGUAGE="JavaScript"> <!-- function f_check() { if(document.F1.num1.value!=""&&document.F1.num2.value!=""&&document.F1.num3.value!=""&&document.F1.num4.value!=""&&document.F1.num5.value!="" &&document.F1.num6.value!=""&&document.F1.num7.value!=""){ str=0 for(var i = 0;i<document.F1.length;i++){ str+=document.F1[i].value; } alert('合計は'+str+"です"); avrg = (str)/document.F1.length; alert('平均は'+avrg+'です'); //ここから標準偏差の計算(略)。 } // --> </SCRIPT> <form method="post" name="F1" onSubmit="return f_check()"> 数値を入れてください<input type="text" name="num1" size="5"><br> 数値を入れてください<input type="text" name="num2" size="5"><br> 数値を入れてください<input type="text" name="num3" size="5"><br> 数値を入れてください<input type="text" name="num4" size="5"><br> 数値を入れてください<input type="text" name="num5" size="5"><br> 数値を入れてください<input type="text" name="num6" size="5"><br> 数値を入れてください<input type="text" name="num7" size="5"><br> <INPUT TYPE=SUBMIT VALUE="平均をとる"></FORM>

  • 配列変数について

    とても基本的なことなのですが <script l anguage = "JavaScript"> week = new Array("日", "月", "火", "水", "木", "金", "土"); hizuke = new Date( ); day = hizuke.getDay( ); document.write("今日の日付 = ", hizuke.getMonth( ) + 1, "月 ", hizuke.getDate( ), "日 ", week[ day ], "曜日" ); </script> このような配列変数ならば、new Date( )によって呼び出された日付に対応して week[ day ]のところが日付に変わることはわかります。 <head> <title> Java </title> <script language = "JavaScript"> function calc( ) { point = new Array( ); point[0] = ei.value * 1; point[1] = su.value * 1 ; point[2] = ko.value * 1; sum = 0; for( i = 0 ; i < 3 ; i ++) { sum += point[i ]; } goukei .val ue = sum; ave = sum / 3; heikin.value = ave; } </script> </head> <body> <hr> <br> 英語 <input type = "text" size = "8" name = "ei "> <br> <br> 数学 <input type = "text" size = "8" name = "su"> <br> <br> 国語 <input type = "text" size = "8" name = "ko"> <br> <br> <hr> <br> <input type = "button" value = "計算" onclick = "calc( )"> <br> <br>3教科合計 <input type = "text" size = "8" name = "goukei "> 点 : 平均点 <input type = "text" size = "8" name = "heikin"> <br> <br> <hr> </body> </html > このような平均点を求めるプログラムでも point = new Array( ); point[0] = ei.value * 1; point[1] = su.value * 1 ; point[2] = ko.value * 1; sum = 0; for( i = 0 ; i < 3 ; i ++) { sum += point[i ]; このように配列変数を使っているのですが、なぜ配列変数をこのように使っているのかが わかりません。 なぜ、平均点を出すときはnew Array( )の( )の中身は何もなくて、上記のような表現を しているのでしょうか? よろしくお願いします。。

  • textbox間の結合時、空白の時は、スペースを省きたい

    <script type="text/javascript"> <!-- function ketugou(){     document.f.q.value=document.f.t1.value+" "+document.f.t2.value+" "+document.f.t3.value+" "+document.f.t4.value+" "+document.f.t5.value; } //--> </script> <form name="f"> キーワードを入力:<br> <input type="text" size="55" name="t1"><br> <input type="text" size="55" name="t2"><br> <input type="text" size="55" name="t3"><br> <input type="text" size="55" name="t4"><br> <input type="text" size="55" name="t5"><br> <input type="button" name="connect" value="結合" onClick="ketugou()"><br> 結合時の内容を表示:<br> <input type="txt" name="q" size="55" maxlength="255" ><br> </form> で、空白のテキストボックスの場合は、スペース(" ")なしで、 結合させたいんですが、どうしたら、良いのでしょうか?

  • onClickで足し算をして答えを出したい

    過去に同じような質問もありましたが、いろいろ検索してこちらの過去ログを拝見しても解決できなかったので質問させてください。 onClickで計算を始めて答えを<input type="text" name="t3">に表示したいのですが、エラーが出てしまいます。いろいろ試したのですが理由がわかりません。 ちなみにソースが以下です。 <html> <head> <title>計算</title> <SCRIPT language="JavaScript"> <!-- function keisan(){ document.f1.t3.value=parseInt(document.f1.t1.value)+parseInt(document.f1.t2.value); } //--> </SCRIPT> </head> <body> <center> <table border="1" width="700" height="200"> <from name="f1"> <tr> <td width="150">右側 <input type="text" name="t1" > </td> <td width="250"> <input type="radio" name="kei" value="+">+&nbsp;&nbsp;左側<br> <input type="radio" name="kei" value="-">-&nbsp;&nbsp;<input type="text" name="t2"><br> </td> <td width="150">c<br><input type="button" name="iri" value="&nbsp;&nbsp;=&nbsp;&nbsp;" onClick="keisan()"></td> <td width="150"> 答え<br> <input type="text" name="t3"></td> <tr> </form> </table> </center> </body> </html> おわかりの方がいましたらどうかご教授お願いします。

  • VBAでWebページに入力&ボタンクリック

    URLがhttp://xxx.com/のページで次のようなフォームのときExcelで自動入力クリックするマクロを作りたいです。 <input type="hidden" name="room" value="aaaaa"/> <a name="regist" id="regist">総登録数</a> <table width="402" border="1"> <tr> <th align="center" colspan="2"><div align="left"><big>登録ページ</big></div></th> </tr> <tr> <td colspan="2">&nbsp;&nbsp;&nbsp;name <input type="text" size="20" name="name" value="" maxlength="20"> &nbsp;&nbsp;&nbsp;Email <input type="text" size="20" name="email" value=""> &nbsp;&nbsp;</td> </tr> <tr> <td align="center">pass</td> <td><input type="text" size="20" name="pw" maxlength="12" value=""></td> </tr> <tr> <td align="center">category</td> <td><select size="1" name="junle"> <option value="pp" selected="selected">カテゴリ選択</option> <option value="0">その1</option> <option value="1">その2</option> </select></td> </tr> <tr> <td align="center">title</td> <td><input type="text" size="55" name="title" maxlength="25" value=""></td> </tr> <tr> <td align="center">URL</td> <td><input type="text" size="55" name="url"></td> </tr> <tr> <td align="center">intro</td> <td><input type="text" name="comment" size="55" maxlength="50" value=""></td> </tr> <tr align="center"> <td><br></td> <td><input type="submit" name="mode" value="登録"> <input type="reset" value="クリア"></td> </tr> </table> 入力する内容は1行目のA,B,C・・にname,email,pass・・・が順番にそれぞれ入っています。

  • 複数のテキストフォームに対しての出力

    javascriptを勉強中であり、至らぬ点があるかと思いますが質問させてください。 あるhtmlページに複数のテキストフォームがあり、そこにjavascript で for 文を使い 定型文の後に追番を付加したテキストを出力(表示)させたいと思っています。 個別のテキストフォームには出力ができるのですが、複数の指定となると イマイチわかりませんでした… (正しく動作しませんでした) 私の記述が悪いとは思いますが、どのように記述すればよいでしょうか? 知見をお借りできればと思います。 よろしくお願いいたします。 【希望】 サンプル1  テスト1 サンプル2  テスト2 サンプル3  テスト3 上記 ちなみに以下が抜粋構文です。 【html】 <input type="button" value="テストボタン" onclick="myTest()">   ←ここを押すとプログラム -省略- <form name="myForm1"> サンプル1  <input type="text" size="30" name="form1" value="" readonly><br> サンプル2  <input type="text" size="30" name="form2" value="" readonly><br> サンプル3  <input type="text" size="30" name="form3" value="" readonly><br> <input type="reset" value="クリア"> </form> 【javascript】 function myTest() { for (num = 1; num <=3; num++) { // document.myForm1.form1.value = "テスト" + num ; だったら表示できる document.myForm1.form[num].value = "テスト" + num ; } } ※「form[num]」の部分が悪いとは思っていますが…

  • 自分のIEでは計算が行われません。

    昨日も質問させてもらったのですが、また困ったことが起きました。 下のHTMLをIEで表示させてみたのですが、友人の環境ではコンボボックスの数字を変えることによって計算されるのですが、私の環境では計算が行われません。 何が原因なのでしょうか? <html> <head> <title> プログラミング基礎 </title> <script language ="JavaScript"> <!-- function calc(amount){ document.mugcup.total.value = 498 * eval(amount); }//--> </script> </head> <body> <form name=mugcup> マグカップ(1個 税込498円:お一人様限定5個まで)<br> <hr> 個数: <select name ="num" onchange = "javascript:calc(this.value)"> <option value =0>0 <option value =1>1 <option value =2>2 <option value =3>3 <option value =4>4 <option value =5>5 </select> 小計: <input type="text" size="8" name="total">円<br> <hr> </form> </body> </html>

専門家に質問してみよう