将事件处理程序绑定到动态加载的输入

Question

我有一个分页输入字段，它是在主页的ajax调用加载一些数据之后动态创建的。输入字段有goto。

所以是这样的： - 主页有一个功能的脚本调用loadData() - 当用户Ajax调用，一台从通过AJAX数据库中抽取。 - 此ajax数据包含分页标签（First,Prev,Next,Last）以及.goto字段，用户可在其中输入页码。当用户输入页码时，应该调用主页面的loadData（）函数。

这是我的代码（这是在主页上）：

$('.goto').bind('keydown', function(e){ 
     console.log(e.which); 
     if(e.which==13) 
     loadData($(this).val()); 
    }); 

但没有任何反应。没有任何控制台消息。

Answer 1

如果元素是动态创建的，则应使用on()方法，同时使用event delegation将事件绑定到元素。

在你的情况，下面应该工作：

$(document).on('keydown', '.goto', function(e){ 
    console.log(e.which); 
    if(e.which==13) 
    loadData($(this).val()); 
});