选择其他值时,下拉列表不会更新

时间:2014-07-15 08:24:54

标签: javascript

您好我的表单我已经使用 java脚本 更改事件它为我的文本框工作但不适用于我的下拉框,每当我&# 39; m从下拉菜单中选择

值必须改变,但它不起作用

以下是代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>

        <script type="text/javascript">

            function add() 
            {
                var ea   = parseInt(document.TransactionForm.earnamount.value);
                var td   = parseInt(document.TransactionForm.taxdeduction.value);
                var ap   = parseInt(document.TransactionForm.amountpaid.value);
                var arwo = parseInt(document.TransactionForm.amountremainwithoffice.value);
                var result = (ea * td) / 100;
                var result1 = ea-result;
                var result2 = result1 - ap;
                document.TransactionForm.amountpayable.value = result1 ;
                document.TransactionForm.amountremainwithoffice.value = result2 ;

            }

        </script>
        <title>Calculate</title>
    </head>
    <body>

        <form action="#" name="TransactionForm" method="post">
            Earn Amount:<br />
            <input type="number" id="earnamount" name="earnamount" onChange="add()" ><br /><br />

            Tax Deduction:<br />

            <select name="taxdeduction" id="taxdeduction" onchange="add()">

                <option value="2">Two Percent</option>
                <option value="5">Five Percent</option>

            </select>
            <br /><br />

            Amount Payable:<br />
            <input type="number" id="amountpayable" name="amountpayable" ><br /><br />

            Amount Paid:<br />
            <input type="number" id="amountpaid" name="amountpaid" onchange="add()" ><br /><br />

            Amount Remain With Office:<br />
            <input type="number" id="amountremainwithoffice" name="amountremainwithoffice" ><br /><br />
            <input type="submit" value="Submit To Database" />
        </form>

    </body>
</html> 

4 个答案:

答案 0 :(得分:0)

此处使用的函数名称add()与HTMLSelectElement add方法冲突 - See here。您的代码生成了一个javascript错误,上面写着 -

TypeError: Not enough arguments to HTMLSelectElement.add.

我没有太多关于错误的细节。

将方法名称更改为其他名称将起作用。见jsfiddle example

只需将您的方法名称更改为其他名称即可。例如。将add()更改为addThis()

答案 1 :(得分:0)

你可以做这样的事情

小提琴: fiddle

<select id="taxdeduction" onchange="myfun()">
<option value="2">Two Percent</option>
<option value="5">Five Percent</option>
</select>

答案 2 :(得分:0)

它应该正常工作,看看这里:http://jsfiddle.net/jpkhw/

<script type="text/javascript">
function populateList() {
    alert("Test");
}
</script>

<select onchange="populateList();">
<option>1</option>
<option>2</option>
</select>​

或者在这里:select onclick onchange not working

答案 3 :(得分:0)

始终使用javascript注册处理程序,并避免内联事件处理,使用JS注册事件处理程序解决它: -

window.onload =function (){
var p1 = document.getElementById("taxdeduction");
if (p1.addEventListener) {
pl.addEventListener("change", add, false);
} else {
pl.attachEvent('onchange', add);
}
};

以下是您正在使用的代码 - fiddle

Reference for source