根据所选项目和其他值更改输入框的值

时间:2015-03-25 09:38:27

标签: javascript

基本上,我正在为健身房会员制作申请表。 基本费用为100美元。如果选择杂耍,费用将增加50美元。 此外,如果'BMI'>>,基本费用将增加50美元。 25和< = 30.如果'BMI'是> 30,它将增加100美元。 这是我的代码。它没有按预期工作。想要一些帮助。非常感谢。

    <!DOCTYPE html>
    <html>
    <head>
    <title>UWS application form</title>
    <link rel="stylesheet" href="Prac1Task2.css" />
    </head>
    <body>
    <form>
    <fieldset>
    <legend>Fitness Details</legend>
Favourite Activities: <br/>
    <input type="checkbox" name="activity" value="cycling" id="cycling"><label for="cycling">Cycling</label>    
    <input type="checkbox" name="activity" value="50" id="juggling" onchange="update(this);"><label for="juggling">Juggling</label>     
    <br/>
    <br/>
    <label for="height">What is your height &#40;Meters&#41;</label><br/>
    <input type="number" name="height" id="height" class="input" onchange="getBMI()">
    <br/>
    <label for="weight">What is your weight? &#40;kg&#41;</label><br/>
    <input type="number" name="weight" id="weight" class="input" onchange="getBMI()">
    <br/>
    <label for="bmi">BMI:</label><br/>
    <input type="number" name="bmi" id="bmi" class="input" value="" readonly>
    <script>
        function getBMI()
        {
            var height = document.getElementById("height").value;
            var weight = document.getElementById("weight").value;
            document.getElementById("bmi").value = (weight / height) / height;
            var bmi = document.getElementById("bmi");
            var price = document.getElementById("price").value;
            if (bmi.value > 25 && bmi.value <= 30)
            {

                parseInt(price.value) += parseInt(50);
            document.getElementById('price').value =  price.value;
            }
            else if (bmi.value > 30)
            {
                document.getElementById("price").value = document.getElementById("price").value + 100;

            }
    }
    </script>

    </fieldset>
    <br/>
    <fieldset>
    <legend>Application Details</legend>
    Date of Application:<br/>
    <input class="input" id="date" name="date" readonly />
    <script>
    var timetime = new Date();
    document.getElementById("date").value = (timetime.getDate() + "/" + (timetime.getMonth() + 1)
                + "/" + timetime.getFullYear());
    </script>
<br/><br/>
Cost of Application: <br/>
$<input type="number" class="input" id="price" name="price" step="0.01" value="100" readonly />
    <script>
    var total = 100;
    function update(feature) {

        if(feature.checked == true){

            total += parseInt(feature.value);
        document.getElementById('price').value =  total;
        }

        if(feature.checked == false){

            total -= parseInt(feature.value);
            document.getElementById('price').value =  total;
            }
    }
    </script>
    </fieldset>
    <br/>
    <input type="submit" value="Submit" class="button">
    </form>
    </body>
    </html>

1 个答案:

答案 0 :(得分:0)

您尚未提及您所面临的确切问题。但是,我认为这行代码应该存在一些问题。

 parseInt(price.value) += parseInt(50);

parseInt()是一个函数,您无法为其赋值。

应该是这样的事情

price.value = parseInt(price.value) + parseInt(50);

此外,price.value不是一个正确的参考,因为您正在为其分配document.getElementById("price").value;。所以你应该使用 price 而不是 price.value