Jquery更改事件未触发答案

【问题标题】：Jquery change event not triggringJquery更改事件未触发
【发布时间】：2017-02-25 17:57:57
【问题描述】：

这是我的代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>DDL change </title>
    <script src="Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>
    <script>
        $(document).ready(function () {
            BindState();
            doit();
            $('#ddlState').on('change', function () {  //this method is not triggering..
                $('.ddlCity').val(parseInt(4)).change();
            });
        });
        function BindCity() {
            $('.ddlCity').append('<option value="1">one</option><option value="2">Two</option><option value="3">Three</option><option value="4">Four</option><option value="5">Five</option>');
        };
        function BindState() {
            $('#ddlState').append('<option value="1">one</option><option value="2">Two</option><option value="3">Three</option><option value="4">Four</option><option value="5">Five</option>');
        };
        function doit() {
            $('#ddlState').val(parseInt(3)).change();
        };
    </script>
</head>
<body>
    <div>
        <select id="ddlState" onchange="BindCity()">
        </select>
    </div>
    <div>
        <select class="ddlCity"></select>
    </div>
</body>
</html>

更改事件不会动态触发，如果我手动更改下拉事件将触发.. 请解释一下是什么问题

【问题讨论】：

标签： javascript jquery .net

【解决方案1】：

您的问题是change() 没有触发事件，它订阅了一个事件。

您正在寻找jQuery#trigger:

但是，在这种情况下，我建议将逻辑移至另一个函数，您可以随时调用该函数。我已将其命名为 adjustCity，但我相信您可以为它提供更好的描述。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>DDL change </title>
    <script src="Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>
    <script>
        function adjustCity () {
            $('.ddlCity').val(4)
        }
        $(document).ready(function () {
            BindState();
            $('#ddlState').on('change', adjustCity);
            doit();
        });
        function BindCity() {
            $('.ddlCity').append('<option value="1">one</option><option value="2">Two</option><option value="3">Three</option><option value="4">Four</option><option value="5">Five</option>');
        };
        function BindState() {
            $('#ddlState').append('<option value="1">one</option><option value="2">Two</option><option value="3">Three</option><option value="4">Four</option><option value="5">Five</option>');
        };
        function doit() {
            $('#ddlState').val(3).trigger('change')
            adjustCity()
        };
    </script>
</head>
<body>
    <div>
        <select id="ddlState" onchange="BindCity()">
        </select>
    </div>
    <div>
        <select class="ddlCity"></select>
    </div>
</body>
</html>

编辑：感谢AHBagheri 提醒我移动doit() 呼叫。

【讨论】：