在使用AJAX获取html内容后,将侦听器添加到新元素的正确方法是什

发布时间：2020-12-16 01:35:56 所属栏目：百科来源：网络整理

导读：我正在制作可以通过 AJAX加载新设置页面的东西,我不确定将侦听器绑定到新内容页面中的那些元素的最有效方法是什么？这是我的想法.我可以创建一个比较文件路径的函数,对于每个条件,然后我将根据AJAX加载的页面将正确的侦听器应用于这些新元素.如果我有大量的

我正在制作可以通过 AJAX加载新设置页面的东西,我不确定将侦听器绑定到新内容页面中的那些元素的最有效方法是什么？

这是我的想法.我可以创建一个比较文件路径的函数,对于每个条件,然后我将根据AJAX加载的页面将正确的侦听器应用于这些新元素.如果我有大量的页面,我觉得它会使功能如此之大.

谢谢！

两种方式：

1)使用.on()绑定非动态父容器

$('.some-parent-class').on('click','.element',function() {
  // DO STUFF!
});

2)在ajax调用完成后绑定新元素

$.ajax(url,{
  // ajax options
}).done( function(data) {
  var newEl = $('<div class="element"></div>');
  // Setup your newEl with data here...
  newEl.on('click',function() {
    // do stuff
  });
  newEl.appendTo($('.some-parent-class'));
});

前者通常会导致更快的ajax响应时间,但也可能会降低点击响应速度.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!