下拉菜单在选择另一个值时没有更新

Dropdown is not updating while selecting another value

本文关键字:更新 选择 另一个 下拉菜单      更新时间:2023-09-26

Hello在我的表单中,我使用了java脚本on change事件它适用于我的文本框但不适用于我的下拉框,每当我从下拉框中选择其他

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

代码如下:

<!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> 

这里使用的函数名add()与HTMLSelectElement add方法-冲突在这里看到的。你的代码生成了一个javascript错误,上面写着——

TypeError: Not enough arguments to HTMLSelectElement.add.

我没有关于这个错误的详细信息。

将方法名称更改为其他名称将有效。参见这个jsfiddle示例

把你的方法名改成别的。如。修改add()为addThis()

你可以这样做

小提琴:小提琴

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

应该可以正常工作,看看这里: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

总是使用javascript注册你的处理程序,避免内联事件处理,使用JS注册你的事件处理程序解决它:-

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

这是你的工作代码- fiddle

来源参考