Question

我正在使用adobe dreamweaver编写代码。它是一个价格计算器，可以在更改单选按钮或在输入文本中键入数字时立即计算价格。它的工作原理是javascript代码在html文件中。但是，当我将代码放入sparate javascript文件时，它会正常工作，当我更改单选按钮时，价格会自动更改，我必须输入＆＃34; facadeArea＆＃34;并按Enter键以查看已更改的＆＃34;总价格＆＃34;。请帮帮我。

<html>
<font face="Algerian">
    <h2>
        What Kind of Project Would You Like to Order?
    </h2>
</font>
<form name="mdl">


    <div>
        Project style:
    </div>
    <div>
        &nbsp &nbsp
        <input type="radio" name="options" value="1" 
onchange="estimateTotal(this);">modern &nbsp &nbsp <input type="radio" 
name="options" value="1.8" onchange="estimateTotal(this);">classic &nbsp 
&nbsp
         <input type="radio" name="options" value="1.6" 
onchange="estimateTotal(this);">traditional &nbsp &nbsp
        <input type="radio" name="options" value="1.7" 
onchange="estimateTotal(this);">prarmetric &nbsp &nbsp <input type="radio" 
name="options" value="1.3" onchange="estimateTotal(this);">organic
        <input type="hidden" name="options">
    </div>
    <div> Project function</div>
    <div>
        <input type="radio" name="style" value="1" 
onchange="estimateTotal(this);">villa &nbsp &nbsp <input type="radio" 
name="style" value="1.4" onchange="estimateTotal(this);">apartment &nbsp 
&nbsp <input type="radio" name="style" value="1.5" 
onchange="estimateTotal(this);">commercial
        &nbsp &nbsp <input type="radio" name="style" value="1.6" 
onchange="estimateTotal(this);">official &nbsp &nbsp <input type="radio" 
name="style" value="1.3" onchange="estimateTotal(this);">other
        <input type="hidden" name="style">
        <br /> Facade Area <br /> &nbsp &nbsp <input type="text" name="area" 
value="0" onchange="estimateTotal(this);">sqm
        <input type="hidden" name="area">
    </div>
    <br />


    <p>Total Price: <input type="text" name="total_price" value="0" 
readonly="readonly"></p>

  </form></html>



    <script>

     var ps = 'input[name="options"]:checked';
    var pf = 'input[name="style"]:checked'

    function estimateTotal(input) {
        if (!document.querySelector(ps) || document.querySelector(ps).length == 0) return;
        if (!document.querySelector(pf) || document.querySelector(pf) .length == 0) return;

        var projectStyle = document.querySelector(pf).value;
        var projectFunction = document.querySelector(ps).value;
        facadeArea = Number(document.getElementsByName('area')[0].value);

        var total = parseFloat(mdl.total_price.value);




        if (facadeArea == 0) {
            total = 0;
        } else if (facadeArea > 0 && facadeArea <= 1200) {
            total = parseInt(200000 + 166.7 *
                facadeArea) * projectStyle * projectFunction;
        } else if (facadeArea > 1200 && facadeArea <= 4000) {
            total = parseInt(400000 + 35.71 *
                facadeArea) * projectStyle * projectFunction;
        } else if (facadeArea > 4000 && facadeArea <= 10000) {
            total = parseInt(500000 + 16.66 *
                facadeArea) * projectStyle * projectFunction;
        } else {
            total = 700000;
        }





        mdl.total_price.value = total;
    }

    </script>

键入数字或更改单选按钮时立即改变价格

0 个答案: