Javascript - 我创建了一个包含多个值的表单,但只有一个正在计算?

问题描述 投票:0回答:4

我不知道为什么,但只有橙子似乎以我创造的形式计算,但我指定的其他水果没有。我为每个水果指定了每个.value。所有水果的形式在逻辑上与我所看到的相同,所以我不明白为什么我没有得到西瓜或菠萝的结果。

<?xml version = "1.0"?>

<html xmlns = "http://www.w3.org/1999/xhtml"> 
<head> 

<title> Purchase Orange </title>
    <!-- Script for the event handlers --> 

        <script type = "text/javascript">
            // The event handler function to compute the cost

            function computeCost() {
                var orange = document.getElementById("orange").value;
                // Compute the cost
                document.getElementById("cost").value = orange * 1.99;


                var watermelon = document.getElementById("Watermelon").value;
                document.getElementById("cost").value = watermelon * 4.99;

                var pineapple = document.getElementById("Pineapple").value;
                document.getElementById("cost").value = pineapple * 4.69;



            } //* end of computeCost 
        </script>

</head> 

<body> 

<form>
    Orange $1.99/lb <input type = "text" id = "orange" size ="3" />
    <br />

</form> 

<form>
    Watermelon $4.99/lb <input type = "text" id = "watermelon" size ="3" />
    <br />

</form> 

<form>
    Pineapple $4.69/lb <input type = "text" id = "pineapple" size ="3" />
    <br />
</form>

<form>      
    Total Cost is <input type = "text" id = "cost" size ="5" />
    <br />
</form>

<form>      
    <input type = "button" value = "Total Cost" onclick="computeCost();"/>
</form> 

</body>

javascript html forms calculated-columns
4个回答
2
投票

在你的身份证中发现一个简单/资本问题,做了一个小的fiddle,检查一下。

       function computeCost() {
            var orange = document.getElementById("orange").value;
            // Compute the cost
            var a = orange * 1.99;


            var watermelon = document.getElementById("watermelon").value;
            var b = watermelon * 4.99;

            var pineapple = document.getElementById("pineapple").value;
            var c = pineapple * 4.69;

            var total = eval(a + b + c);

            document.getElementById("cost").value = total;                


        } //* end of computeCost 

1
投票

问题是你使用的是错误的ID:

使用:

var watermelon = document.getElementById("watermelon").value;
 var pineapple = document.getElementById("pineapple").value;

代替:

     var watermelon = document.getElementById("Watermelon").value;
        var pineapple = document.getElementById("Pineapple").value;

显示所有计算值的总和。像这样:

var grandtotal =pineapple+ watermelon+orange;
        document.getElementById("cost").value = grandtotal;     

0
投票

改变你的身份的情况

var watermelon = document.getElementById("watermelon").value;

var pineapple = document.getElementById("pineapple").value;

0
投票

我认为这是因为getDocumentById是Key敏感的。你已经写了这样你的身份:pineapplewatermelon你用这样的大写字母检查它们:PineappleWatermelon

© www.soinside.com 2019 - 2024. All rights reserved.