簡単な見積もりフォーム

<html>
<head>
</head>

<body>
<script language="JavaScript">

<!--
function showEstimate(){
　var intPrice=0;

　if (document.form1.chkBuy01.checked) {
　　intPrice=intPrice+ (1000 * document.form1.txtNum01.value) ;
　　}
　if (document.form1.chkBuy02.checked) {
　　intPrice=intPrice+ (1500 * document.form2.txtNum01.value) ;
　　}
　if (document.form1.chkBuy03.checked) {
　　intPrice=intPrice+ (2000 * document.form3.txtNum01.value) ;
　　}

　newWin = window.open("","","width=300,height=200,location=no,menubar=no,toolbar=yes,resizable=yes");
　newWin.document.write("<br><center>お見積もり結果<hr><br>");
　newWin.document.write("ご購入金額の合計は、" + intPrice + "円になります。<br><hr></center>");
　newWin.document.write("<center><form><input type='button' value='閉じる'
　onclick='window.close()'></form></center>");

}
//-->

</SCRIPT>

<center>
<hr>簡単な見積もりフォーム<hr>
<br>下記の項目に入力して「確認」ボタンをクリックして下さい<br><br>
<form name= "form1">
<table border="1">
<tr>
<td>購入</td>
<td>商品名</td>
<td>金額</td>
<td>個数</td>
</tr>
<tr>
<td><input type="checkbox" name="chkBuy01"></td>
<td>ＨＴＭＬタグ事典</td>
<td>1000円</td>
<td><input type="text" name="txtNum01" value="1" size="3"></td>
</tr>
<tr>
<td><input type="checkbox" name="chkBuy02"></td>
<td>ＣＳＳハンドブック</td>
<td>1500円</td>
<td><input type="text" name="txtNum02" value="1" size="3"></td>
</tr>
<tr>
<td><input type="checkbox" name="chkBuy03"></td>
<td>JavaScriptサンプルブック</td>
<td>2000円</td>
<td><input type="text" name="txtNum03" value="1" size="3"></td>
</tr>

</table>
<br><br>
<center><INPUT TYPE="button" VALUE="見積もりをする" onclick = "showEstimate()"></center>
</form>
<TABLE>
<TBODY>
<TR></TR>
</TBODY>
</TABLE>
</center>
</body>
</html>
if (document.form1.chkBuy01.checked) {
intPrice=intPrice+ (1000 * document.form1.txtNum01.value) ;
<td><input type="checkbox" name="chkBuy01"></td>
<td>ＨＴＭＬレッスンキット</td>
<td>1000円</td>
<td><input type="text" name="txtNum01" value="1" size="3"></td>
【解説】
長すぎるので下段に重要なところをピックアップしました。
赤字部分はチェックボックスの認識に対応しています。
checkedは”チェックが入っている”という意味です。
いつも入れていたvalueは文字列という意味です。
青色部分は合計額です。テキスト通りだと品物ごとに
乗算されてしまうのでかっこの位置を変えましょう。
緑色部分は個数を表しています。これはこれまでの
知識があればわかりますね？
そして、新しいウインドウに合計額を表示させるように
します。

戻る