Jquery的更改事件不triggring

问题描述：

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

上改变事件不是动态触发，如果我改变下拉手动事件将触发.. 好心给我解释一下是什么问题

答

你的问题是，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()。

Jquery的更改事件不triggring

相关推荐