如何从HTML表单传递输入变量

Question

我正在尝试创建一个代码，该代码将询问用户X，Y等的多少项，并使用Javascript计算所欠的总额，并打印所有已购买项的摘要（收据）。 很抱歉出现菜鸟问题，试图在没有任何正式培训的情况下学习代码。 感谢您的所有帮助！

<html>

<head>

<title>Cost Calculator</title>

<script language="javascript" type="text/javascript">
function packageTotal(){
    //Enter in prices here
    var applePrice = 1;
    var bookPrice = 2;
    x = Number(document.calculator.books.value);
    y = Number(document.calculator.apples.value);
    var b = applePrice*x + bookPrice*y;
    var p = applePrice*x + bookPrice*y + .5;

    if (document.getElementById('noBag').checked) {
    //Basic package is checked
    document.calculator.total.value = b;
        } else if (document.getElementById('yesBag').checked) {
    //Pro package is checked
    document.calculator.total.value = p;
        }

    //Want to add summary of purchase
    //document.write("You want " + x " books and " y " apples.");


}

</head>

<body>

<!-- Opening a HTML Form. --> 
<form name="calculator">

<!-- Here user will enter the number of Books and Apples --> 
Enter Number of Books: <input type="text" name="books"> 
<br />

Enter the Number of Apples: <input type="text" name="apples">
<br />

<br />
<input type="radio" name="item" id="noBag" value="No" /> noBag
<input type="radio" name="item" id="yesBag" value="Yes" checked /> yesBag

<!-- Here result will be displayed. -->

<input type="button" value="Submit" onclick="packageTotal();">

Your Total Price is: <input type="text" name="total">

</form>


</body>
</html>

Answer 1

从这个问题尚不清楚，但是如果这是问题所在：

//Want to add summary of purchase
//document.write("You want " + x " books and " y " apples.");

那肯定会破裂。 document.write仅在文档仍在加载时添加到当前文档中。 如果事后调用它，它将隐式打开一个新文档进行写入，从而破坏当前页面。 通常， document.write是一件坏事。

（由于缺少+级联运算符，也存在一些琐碎的语法错误）

如果要向页面写入任意文本，请创建一个占位符元素：

<div id="message"></div>

然后设置其文本内容：

function setTextContent(element, text) {
    element.innerHTML = ''; // remove current content
    element.appendChild(document.createTextNode(text));
}

var message = document.getElementById('message');
setTextContent(message, 'You want '+x+' books and '+y+' apples.');

（在textContent上有一个textContent属性，您也可以使用它代替函数，但是在IE <9上不支持，而是使用innerText 。在这种情况下，直接将消息直接写入innerHTML也是可行的，但这很不好习惯，因为与用户输入一起使用时，这会导致HTML注入安全漏洞。）

如何从HTML表单传递输入变量

问题描述

1 个解决方案

解决方案1
1 已采纳 2013-08-02 13:40:31

如何从HTML表单传递输入变量

问题描述

1 个解决方案

解决方案1 1 已采纳 2013-08-02 13:40:31

解决方案1
1 已采纳 2013-08-02 13:40:31