使用JavaScript添加表單值

Question

我將如何使用JavaScript從表單中添加一些值？ 我想在表單底部的只讀文本字段中顯示該值。 到目前為止，這是我的代碼，我已將每個表單值都設為要添加的值：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function checkAll(){
document.getElementById("notop").checked=false;
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
    field[i].checked = false ;
}



</script>

</head>

<body>
<div class="head">
<h3 align="center">Gourmet Pizza</h3>
</div>
<div class="main">
<form action="" method="get" name="pizza">
<table border="1" cellpadding="5" cellspacing="3">
  <tr>
    <td>Name:</td>
    <td><input name="name" type="text" id="name" /></td>
  </tr>
  <tr>
    <td>E-Mail:</td>
    <td><input name="email" type="text" id="email" /></td>
  </tr>
  <tr>
    <td>Phone:</td>
    <td><input name="name" type="text" id="phone"/></td>
  </tr>
  <tr>
    <td style="border:none"><input name="size" type="radio" value="8.00"  id="small" onclick="this.form.total.value=calculateTotal(this);" > <label for="small">Small ($8.00)</label></td>
    <td style="border:none">
    <input type="checkbox" name="topping" id="pepperoni" value="0.50" onClick="checkAll(document.pizza.topping)" class="top"/>
    <label for="pepperoni">Pepperoni
    </label> 
    <input type="checkbox" name="topping" id="sausage" value="0.50" onClick="checkAll(document.pizza.topping)" class="top" />
    <label for="sausage">Sausage
    </label>
    </td>
  </tr>
  <tr>
    <td style="border:none"><input name="size" type="radio" value="10.00" id="medium" onclick="this.form.total.value=calculateTotal(this);" /> <label for="medium">Medium ($10.00)</label></td>
    <td style="border:none">
    <input type="checkbox" name="topping" id="mushroom" value="0.50" onClick="checkAll(document.pizza.topping)" class="top"/>
    <label for="mushroom">Mushroom
    </label> 
    <input type="checkbox" name="topping" id="olive" value="0.50" onClick="checkAll(document.pizza.topping" class="top"/>
    <label for="olive">Olive
    </label>
    </td>
  </tr>
  <tr>
    <td style="border:none"><input name="size" type="radio" value="12.00" id="large" onclick="this.form.total.value=calculateTotal(this);" onselect="addTwelve()"/> <label for="large">Large ($12.00)</label></td>
    <td style="border:none">
    <input type="checkbox" name="Un_CheckAll" value="0.00" id="notop" class="none" onClick="uncheckAll(document.pizza.topping)"/>
    <label for="notop">No Toppings (Cheese Pizza)
    </label> 
    </td>
  </tr>
  <tr>
    <td colspan="2">
    Your Order:<br />s
    <textarea name="" colums="2">

    </textarea>
    </td>
  </tr>
  <tr align="center">
    <td colspan="2"><input type="submit" name="button" id="button" value="Process Order" />
      <input type="reset" name="button2" id="button2" value="Clear Order" /></td>
  </tr>
</table>
</form>
</div>
</body>
</html>

任何幫助是極大的贊賞！

Answer 1

你可以做這樣的事情

var total = 0;
window.onload = function() {
    var toppings = document.pizza.topping;
    for (var i = 0, l = toppings.length; i < l; i++) {
        toppings[i].addEventListener("change", function() {
            if (this.checked) {
                total += parseFloat(this.value);
            } else {
                total -= parseFloat(this.value);
            }
            alert(total);
        }, false);
    }
};

在這里查看示例

使用JavaScript添加表單值

問題描述

1 個解決方案

解決方案1
0 2011-10-25 03:30:37

使用JavaScript添加表單值

問題描述

1 個解決方案

解決方案1 0 2011-10-25 03:30:37

解決方案1
0 2011-10-25 03:30:37