Question

我有三个依赖选择。第一个，有一些价值观。

<select id="first">
<option value="1">v1</option>
<option value="2">v2</option>
</select>

第二和第三位是空白的：

<select id="second"></select>
<select id="third"></select>

我想通过ajax请求填充空白选择。所以我这样做：

jQuery('body').delegate('#first','change',function(){
jQuery.ajax(
{
'type':'GET',
'data':{'changed':$('#first').val()},
'url':'myURL1',
'cache':false,
'success':function(html){jQuery("#second").html(html)}});
return false;
});

所以它运作正常。第二个选择已填充，但是......没有'select'事件被激活为select'second'。为了得到这个事件，我写道：

   $(document).ready(function()
    {
        $('#second').live("change", function()
        {
            alert('test');
        });
    });

但是没有警报'测试'可见。如何捕获动态加载内容的“更改”事件以进行第二次选择？

Answer 1

试试这个：

$('#second').change(function(){
    alert('Test')
})

Answer 2

因为#second元素只是存在，所以不必使用委托和实时函数

$('#first').change(function(){ 
  $.ajax( 
  { 
    'type':'GET', 
    'data':{'changed':$('#first').val()}, 
    'url':'myURL1', 
    'cache':false, 
    'success':function(html){
      $("#second").html(html);
     }
   }); 
   return false; 
});

$('#second').live("change", function()   
{   
  alert('test');   
});

如果要在填充第二个选择后立即执行警报，则将其包含在$ .ajax（）的回调函数中

$('#first').change(function(){ 
  $.ajax( 
  { 
    'type':'GET', 
    'data':{'changed':$('#first').val()}, 
    'url':'myURL1', 
    'cache':false, 
    'success':function(html){
      $("#second").html(html);
      $("#second").change();
     }
   }); 
   return false; 
});

Answer 3

您使用的是哪个版本的jQuery？ 1.4.x之前的任何内容都不支持live的{{1}}个事件。

（见Why doesn't jQuery 1.3.3. live() support all events?）

以下是http://api.jquery.com/live/

的API

你可以在警告中看到：

在jQuery 1.3.x中仅有以下内容 JavaScript事件（除了自定义事件）可以绑定 .live（）：点击，dblclick，keydown，按键，键盘，mousedown，mousemove， mouseout，mouseover和mouseup。

Answer 4

到目前为止，jquery从jQuery 1.7更新了它的版本，它引入了“on”，请参见http://api.jquery.com/on/。因此，如果您明确使用以下方式，则会调用“更改”事件。

 $(document).ready(function()
{
    $('#second').on("change", function()
    {
        alert('test');
    });
});

jQuery选择“更改”事件未触发

4 个答案: