Question

单击按钮，将显示组合框并选择组合框。变更事件未被调用。

请让我知道我在哪里犯了错误。

<html>
<head>
<script src="jquery17.js" type="text/javascript"></script>
<script>
  $("select").change(function(){
        alert(this.id);
    });

$(document).ready(function(){
  $("button").click(function(){
   var s = $('<select />');
   var data = {
    'foo': 'bar',
    'foo2': 'baz'
}
for(var val in data) {
   $('<option />', {value: val, text: data[val]}).appendTo(s);
}
s.appendTo('body');
 });
});
</script>
</head>
<body>
<div id="div1"></div>
<button>Get External Content</button>
</body>
</html>

Answer 1

$(document).on("change", "select", function(){
        alert($(this).attr("id"));
});

由于<select>标签是动态附加的，因此您必须在其上委托事件。

Answer 2

$("select").change(function(){
    alert(this.id);
});

问题是你不能在$(document).ready(function(){区块中执行此操作。

将其移动到那里，否则您将在尚不存在的DOM元素上设置事件处理程序。

Answer 3

你必须将它放在doc ready中，但是在将它们附加到正文后是肯定的，这是动态的，所以将事件委托给closest parent element或document本身，这是所有人的父母。

<script>
  $(document).ready(function(){
      $("button").click(function(){
           var s = $('<select />');
           var data = {
                 'foo': 'bar',
                 'foo2': 'baz'
            }
           for(var val in data) {
               $('<option />', {value: val, text: data[val]}).appendTo(s);
            }
          s.appendTo('body');
       });

       // you need to place that here.
             $(document).on('change', 'select', function(){
                 alert(this.id);
             });

    });

Combobox事件未被调用

3 个答案: