• ベストアンサー

HTMLの表示で

こんにちわ。 大学でプログラミングの入門の講義をとっているので自分で試しにコンボボックスのHTMLを作ってみました。 しかし、コンボボックスの中の数字を変えてみても計算結果がWeb上で表示されません。何度見直しても原因がわからないのです。 どうかご教授お願いします。 <html> <head> <title> プログラミング基礎 </title> <script language ="JavaScript"> function calc(){ total.value=498*num.value; } </script> </head> <body> マグカップ(1個 税込498円:お一人様限定5個まで)<br> <hr> 個数: <select name ="num" 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/> 小計: <input type="text" size="8" name="total">円<br> <hr> </body> </html> Web上ではこのようになりました。 ↓ C:\Documents and Settings\大野将宏\デスクトップ\プログラミング基礎\001-0.html

  • HTML
  • 回答数5
  • ありがとう数2

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

  • ベストアンサー
回答No.4

いろんなものを端折り過ぎだと思います。 #2さんの御指摘のように<form>タグも必要だし、オブジェクト参照の名前も"名字無しの下の名前"だけじゃ不明瞭です。 データの型が違うので掛算もできません。数字と文字列を掛けています。 「個数」として渡される1とか2とかは文字列なので数字に変換しましょう。 <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> ローカルに(手元のHDDに)あるhtmlを読むのにWebサーバは必要ありません

rinnshan
質問者

お礼

WEBサーバは必要なかったのですね。ありがとうございました。

その他の回答 (4)

回答No.5

ぁぅっ^^; 一箇所間違えました これじゃ動かない。。 <html>から数えて8行目  × }-->  ○ }//--> htmlのコメント閉じタグはjavascriptのコメントにしなきゃダメでした 失礼しました。

  • Tasuke22
  • ベストアンサー率33% (1799/5383)
回答No.3

> WEBサーバを立ち上げるとはどのような状態のことを指すのでしょうか? WEBサーバを立ち上げるとは、WEBサーバと言われるソフトを 起動することです。 WindowsXP ProであればIISが付いています。 WindowsXP Homeには無いので、Apacheなどのフリーソフトを 使います。そこで初めてブラウザからHTMLを読み出せるわけです。 #2さんの間違い指摘はありましたが、 WEBサーバ:Apacheでブラウザ:IE6でエラー出ませんでしたね。 間違いは間違いです。

rinnshan
質問者

お礼

WEBサーバについてよくわからなかったのですが、そういうことも知っておいたほうがいいと思うので、これから勉強したいと思います。ありがとうございました。

回答No.2

<select/>の行が間違っています。 正しくは「</SELECT>」。 また、<FORM>~</FORM>タグがないからでは? <FORM>タグにはname属性を入れ、たとえばname="FORM1"とした場合、calc()関数内の「total.value」「num.value」をそれぞれ「FORM1.total.value」「FORM1.num.value」としてみては。 ちなみにC:\Document and settings\…はWeb上ではなくローカルです。

rinnshan
質問者

補足

ローカルとは自分のパソコンの環境のことですよね? どうしたらWeb上で見ることができるようになるのでしょうか?

  • Tasuke22
  • ベストアンサー率33% (1799/5383)
回答No.1

私の環境で動かしたら、ちゃんと計算出来ています。 本当にWEB上で動かされているのでしょうか? 環境は? ご自分のPCでしたら、WEBサーバを立ち上げていますか?

rinnshan
質問者

補足

自分のPCで立ち上げているのですが、知識不足ですいませんが、WEBサーバを立ち上げるとはどのような状態のことを指すのでしょうか?

関連するQ&A

  • 自分の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>

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

    プログラミング初心者なのですが、うまく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>

  • form nameをform actionにしたいんですが・・・

    <html> <head> <title> 商品確認 </title> <script language ="JavaScript"> <!-- function calc(amount){ document.ball.total.value = 4095 * eval(amount); }//--> </script> </head> <body> <form name=ball method="post"> //←ここをform action="x.php"にしたい。 V4SLBL ソフトタッチ鈴入り4号球<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> 上の場所をaction="x.php"にしてx.phpに小計を送ろうとしています。 しかし、actionにすると小計が表示されなくなります。 いろいろ考えましたが全く答えが出てきません。 アドバイスよろしくお願いします。

  • ボタンを押して計算結果を出したい

    下記のもの、うまくいきません。 どのようにしたらよいのでしょうか? 教えてください。よろしくお願いします。 <HTML> <HEAD> <TITLE>Calculator</TITLE> <SCRIPT language = "JavaScript"> function calc(Submit){ Num1 = document.foam1.Num1; Num2 = document.foam1.Num2; Ans = document.foam1.Ans; document.foam1.Ans.value = s1 Ans s2; } </SCRIPT> </HEAD> <PRE> 数値1 演算子 数値2 答え</PRE> <FORM METHOD=GET ACTION="/calc/calc.exe"> <INPUT NAME="Num1" VALUE="" onChange="calc()"> <SELECT NAME="Opr" SIZE=1 VALUE="" onChange="calc()"> <OPTION>+<OPTION>-<OPTION>*<OPTION>/</SELECT> <INPUT NAME="Num2" VALUE="" onChange="calc()"> = <INPUT NAME="Ans" VALUE="" onChange="calc()"> <INPUT TYPE="Submit" VALUE="計算"> </FORM> <H2></H2> </HTML>

  • 見よう見まねで以下のように作成してみたのですが

    見よう見まねで以下のように作成してみたのですが 作動しませんでした。 (当方javascript初心者です) どこに問題があるのか、指摘してくださる方を探しています。 極めて初歩的なところで誤っているのだろうと思いますので 質問するのも恐縮なのですが・・・ どなたかよろしくお願いいたします。 ------------------------------------------ <HTML> <HEAD> <script language="JavaScript"> function calc(){ var a = document.form1.001.value; var b = document.form1.002.value; var c = document.form1.003.value; var d = document.form1.004.value; var total = a + b + c + d; document.form1.field.value = total; } </script> </HEAD> <BODY> <BR><BR> <form name="form1"> <Select name="001"> <Option value="10">case1 <Option value="20">case2 </Select>ケース <BR><BR> <INPUT size="15" type="text" name="002">number <BR><BR> <Select name="003"> <Option value="100">volume1 <Option value="200">volume2 <Option value="300">volume3 </Select>ボリューム <BR><BR> <Select name="004"> <Option value="0">N <Option value="50">size1 <Option value="100">size2 <Option value="150">size3 </Select>サイズ <BR><BR> <INPUT type="button" name="calc" value="計算" onClick="calc()"><BR><BR> <input size="15" readonly="readonly" name="field" type="text">total </form> </BODY> </HTML>

  • HTMLでテキスト入力し表示させる

    HTMLでテキストボックスに文字を入力し、表示させたいのですがうまくできません。 見た目はできているようなのですが、文字が表示されない状態です。 コードを記載しますので、お手数をお掛けしますがご教授頂けますでしょうか。 <html> <head> <script> function add(){ document.getElementById("target").innerText = document.getElementById("name").value; target = document.getElementById("output"); document.write(target); } </script> </head> <body> <p>名前を入力してください</p> <input id="name" name="name" type="text" size="30" onkeydown="update_field();"> <br> <input type="button" onclick="add()" value="実行"> <form action="index.html" method="post"> <br> <input type="submit" name="exit" value="戻る"> </form> </body> </html>

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

    こんばんわ。これは古い型のプログラミングかもしれませんが、 講義でもやっているので、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
  • PHPとhtmlについて

    初心者なりに下のようなプログラムを作ってみましたが、「注文画面へ」のボタンを押しても反応がありません。どうしたらいいでしょうか?教えてください。 あと、注文画面へ行くとボールの個数を選んだ後に出る合計金額を次のページに反映させたいのですが、それもわかりません。もしよければ、こちらも教えてください。 よろしくお願いします。 <html> <head> <title> 商品確認 </title> <script language ="JavaScript"> <!-- function calc(amount){ document.ball.total.value = 4095 * eval(amount); }//--> </script> </head> <body> <form name=ball> V4SLBL ソフトタッチ鈴入り4号球<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> <?php $go['V4SLBL ソフトタッチ鈴入り4号球'] = "4,095円"; echo " 商品確認"; echo "<table border=\"1\">"; foreach($go as $key=>$value) echo '<tr><td>'."$key</td><td>$value</td></tr>"; echo '</table>'; echo"<form action=\"m4.php\" method = \"post\"> <input type = \"submit\" value = \"注文画面へ\"></form>"; echo"<form action=\"m1.php\" method = \"post\"> <input type = \"submit\" value = \"戻る\"></form>"; ?> </form> </body> </html>

    • 締切済み
    • PHP
  • コンボボックスに連動するテキストボックスの表示数変更

    入力フォームを作成しており、コンボボックスの数に応じて、 テキストボックスの表示数を変更させたいと考えています。 コンボボックスでの選択が「2」になれば、その下に表示される テキストボックスの数も2つ表示させたいと思います。 <html> <head> </head> <body> <form> 項目数: <SELECT> <OPTION selected>1</OPTION> <OPTION>2</OPTION> <OPTION>3</OPTION> <OPTION>4</OPTION> <OPTION>5</OPTION> </SELECT> <br> <br> 項目1:<input type="text" name="test1" size="20"> </form> </body> </html> 処理方法をサイトなどで調べましたが、該当するものが見あたりませんでしたので、ご教授お願いいたします。

  • フォームを送信して選択股をそのままにしたい

    フォームを送信してそのフォームで選択した内容を フォームの下の部分に表示するようなプログラムを作りたいのですが 送信するとフォームの選択内容が戻ってしまいます。 選択を保持して表示するにはどうしたらよいですか? 路線情報の検索みたいな感じにしたいということです。 ****self.php**** <html> <head></head> <body> <form action='self.php' method=get> <select name='num' id='num'> <option name='5' value='5'>5</option> <option name='7' value='7'>7</option> </select> <br><input type=submit value='送信'> <form> <script language="javascript"> document.open(); document.write(<?php print $_GET["num"]; ?>); document.close(); </script> </body> </html>

専門家に質問してみよう