Question

我似乎无法让这个工作。我正在使用jquery来创建一个html选择，我想要一些代码在其值发生变化时执行。

代码如下：

<script type ="text/javascript">

   var firstweddingturn = '400';

   $('#weddingturn').change(function() {

      alert ("Wedding select change triggered!");

      //var wedturn = $('#weddingturnselectid').val();
      //$('#div3').append('<br>Wedding turn selected, ' + wedturn + '</br>')

    });


    $(document).ready(function() {

      var html = [];
      html[html.length] = '<select name="weddingturn" id="weddingturn">';
      var a = firstweddingturn;
      var b = Number(firstweddingturn) + 16;
      while (a < b) {
        // do some code
        html[html.length] = '<option name="asdf" value = "1">' + a + '</option>';
        a++;
      }  // end while
      html[html.length] = '</select>';
      $('#div1').append(html.join('')); 

    });
</script>

我做错了什么？

Answer 1

您需要使用.delegate()（或.live()），因为您要动态添加选择。当您使用.change()附加onChange处理程序时，它仅附加到<strong>现有匹配元素，而不是稍后添加的元素。要将事件附加到所有匹配的元素（包括稍后添加到页面中的元素），请使用.delegate()函数，如下所示：

$('body').delegate('#weddingturn','change', function(){
  alert('Wedding select changed to ' + $(this).find('option:selected').val() );
});

但是，正如一些人指出的那样，您只需在将<select>添加到DOM后立即附加事件处理程序。这样，您仍然可以使用.change()，并且您的代码应该运行得更快。

Answer 2

包括这个：

 $('#weddingturn').live('change', function() {

        alert ("Wedding select change triggered!");

        //var wedturn = $('#weddingturnselectid').val();

        //$('#div3').append('<br>Wedding turn selected, ' + wedturn + '</br>')

    });

在$(document).ready

中

并将其更改为使用live

Answer 3

绑定.change()事件时，该元素尚不存在。你有两个选择：

创建元素后绑定事件（最简单且推荐的选项）
使用.delegate()（或.live()）告诉jQuery在将事件添加到DOM时将事件绑定到与选择器匹配的任何元素。如果您选择此选项，如果您使用的是最新版本的jQuery delegate()，> 1.4.2是首选方法，因为它比live()更高效。

Answer 4

您正在动态地将select添加到DOM中，在声明事件处理程序时，select doest不存在，因此事件处理程序不会绑定到元素use {{ 1}}将事件处理程序附加到动态添加的元素

.live

DEMO

jquery live

Answer 5

您需要使用live进行绑定，因为它是在DOM加载后加载的：

$("#weddingturn").live("change", function() {

});

另外，我会把它放在$(document).ready的范围内，最好是在加载它的代码之后（仅为了逻辑线性）。

Answer 6

在创建元素之前，你正在连接事件处理程序。

（您可以使用.live（）或者您只需交换操作顺序）

Answer 7

您正在一个尚不存在的选择上设置change功能。将.change来电转移到.append

之后

jquery创建了select，并在更改时触发

7 个答案: