只需Javascript即可合计表单字段，其中'；我的问题是什么？_Javascript_Html_Forms

只需Javascript即可合计表单字段，其中'；我的问题是什么？

javascript html forms

只需Javascript即可合计表单字段，其中'；我的问题是什么？,javascript,html,forms,Javascript,Html,Forms,目标是获取每种类型的订单数量，并在单击“总成本”时计算所有订单的总价。谷歌调试器说，但我似乎无法让它发挥作用 Uncaught SyntaxError: Unexpected token ; 13 Uncaught ReferenceError: compute is not defined 编辑：修复了括号，但现在我对返回总数的输出lin有问题 Edit2:要返回的.added.value [已解决] <head> <title>Coffee Order

目标是获取每种类型的订单数量，并在单击“总成本”时计算所有订单的总价。谷歌调试器说，但我似乎无法让它发挥作用

Uncaught SyntaxError: Unexpected token ; 13
Uncaught ReferenceError: compute is not defined

编辑：修复了括号，但现在我对返回总数的输出lin有问题

Edit2:要返回的.added.value

[已解决]

<head>

    <title>Coffee Order Form</title>
    <script type="text/javascript">

        function compute()
        {
            //input
            var french = Number(document.getElementById("french").value;

            if(isNaN(french))
                {
                french=0;
                }

            var hazelnut = Number(document.getElementById("hazelnut").value);

            if(isNaN(hazelnut))
                {
                hazelnut=0;
                }

            var columbian = Number(document.getElementById("columbian").value);

            if(isNaN(columbian))
                {
                columbian=0;
                }

            //calculate 
            var total = 3.49 * french + 3.95 * hazelnut + 4.59 * columbian;

            //output
            return document.getElementById("total").value = "$" + total.toFixed(2);

        }
    </script>
</head>

<body>
    <form method="post" action="http://uta.edu">
        <table border="2">
        <caption><b>Coffee Order Form</b></caption>
        <tr>
            <th>Product Name</th>
            <th>Price</th>
            <th>Quantity</th>
        </tr>
        <tr>
            <th>French Vanilla</th>
            <th>$3.49</th>
            <td><input type="text" id="french"></td>
        </tr>
        <tr>
            <th>Hazelnut Cream</th>
            <th>$3.95</th>
            <td><input type="text" id="hazelnut"></td>
        </tr>
        <tr>
            <th>Columbian</th>
            <th>$4.59</th>
            <td><input type="text" id="columbian"></td>
        </tr>
    </table>

    <input type="button" value="Total Cost" onclick="compute()">
    <input type="text" id="total">

    <br/>

    <input type="submit" value="Submit Order">
    <input type="reset" value="Clear Order Form">

    </form>

</body>


咖啡订购单
函数compute（）
{
//输入
var french=编号（document.getElementById（“french”）.value；
if（伊斯南（法语））
{
法语=0；
}
var hazelnut=编号（document.getElementById（“hazelnut”）.value）；
if（伊斯南（榛子））
{
榛子=0；
}
var columbian=Number（document.getElementById（“columbian”）.value）；
if（伊斯南（哥伦比亚））
{
哥伦比亚=0；
}
//算计
var total=3.49*法国+3.95*榛子+4.59*哥伦比亚；
//输出
return document.getElementById（“total”）.value=“$”+total.toFixed（2）；
}
咖啡订购单
品名
价格
量
法国香草
$3.49
榛子奶油
$3.95
哥伦比亚人
$4.59

对Number（）的所有3次调用都缺少结尾括号：

应该是：

var french = Number(document.getElementById("french").value);

由于语法错误，正文中的代码无法使用该函数。因此，未捕获的引用错误。

多个括号中的值不平衡，例如：

var french = Number(document.getElementById("french").value --->)<---- missing;

var french=Number（document.getElementById（“french”）.value-->）所有数字函数都缺少右括号：
var french = Number(document.getElementById("french").value);
var hazelnut = Number(document.getElementById("hazelnut").value);
var columbian = Number(document.getElementById("columbian").value);

是否输入错误？您忘了关闭number（document.getElementById（“french”）.value）确保用户不能输入除数字以外的其他数字，数字（“0x20”）将导致32。如果我是您，我会这样做：var french=parseInt（document.getElementById（“french”）.value | | 0，10）//10是基数（十进制）这样，当值未定义且为“0x20”时，无需检查NaN将导致0。将不得不检查它，我最初使用的是parseInt，但在试图找出我做错了什么的过程中被替换为数字。好的，所以我修复了这个问题。谢谢你不能相信我忽略了这个问题，但现在它在将计算返回到total字段文档时遇到了问题。getElementById（“total”）=“$”+total.toFixed（2）；我得到了：未捕获的引用错误：赋值中的左侧无效我从返回中取出了它，但仍然存在问题您可以尝试document.getElementById（“total”）.value=xxx；（您缺少“.value”部分）这将是问题所在！有时您只需要第二双眼睛，否则您永远看不到有什么问题。
<script src=".."></script>

var french = Number(document.getElementById("french").value);
var hazelnut = Number(document.getElementById("hazelnut").value);
var columbian = Number(document.getElementById("columbian").value);