将侦听器动态添加到jQuery中ajax创建的内容

我正在尝试获取链接链接的html值。 链接是用Ajax动态创建的，所以我认为bind不会 工作，但我没有最新版本。live

$('div#message').click(function() {
  var valueSelected = $(this).html();  // picks up the whole id. I juust want single href!          
  alert(valueSelected);
  return false;
});



<div id="message">
<br/>
<a class="doYouMean" href="#">location A</a>
<br/>
<a class="doYouMean" href="#">location B</a>
<br/>
<a class="doYouMean" href="#">location C</a>
<br/>
<a class="doYouMean" href="#">location D</a>
<br/>
<a class="doYouMean" href="#">location E</a>
<br/>
</div>

$（'div#message'）。单击（函数（）{
var valueSelected=$（this.html（）；//获取整个id。我只需要一个href！
警报（已选择值）；
返回false；
});

将处理程序仅应用于AJAX加载回调中的链接

$('div#message').load( myUrl, function() {
    $('div#message a').click(function() {
       var valueSelected = $(this).html();
       alert(valueSelected);
       return false;
    });
});

你有两个选择-

使用我们以前使用的LiveQuery插件

在每次成功的ajax调用之后，将函数重新绑定到click事件。（推荐）

---

如果可以的话，你真的应该使用最新的版本

如果是使用AJAX添加的“.doYouMean”元素，并且#消息始终存在，请尝试：

$('#message').bind('click', function (event) {
  var target = event.currentTarget;
  if ($('.doYouMean').filter(target)) {
    // target is the .doYouMean that was clicked: Handle here
  };
});

---

（这是有效的：）

另一个解决方案是创建一个用于单击重新初始化的函数，因为您可能有其他情况，如我所说：），所以逻辑可能如下：

$(document).ready(function() {
  initsomething();
});

function initsomething(){
  .......
  $('div#message').click(function() {
    var valueSelected = $(this).html();  // picks up the whole id. I juust want single href!          
    alert(valueSelected);
    return false;
  });
  .......
}

---

在ajax成功运行时，运行initsomething（）：）

这里有一种未提及的替代方法：

如果您使用的是jQuery v1.7+，则可以使用该方法将事件侦听器绑定到当前HTML以及将来添加的HTML：

$('#message a').on('click', function(){
    alert('link clicked!');
});

如果您使用的是较旧版本的jQuery，建议您改用以下方法：

$('#message').delegate('a', 'click', function(){
    alert('link clicked!');
});

总之：

$(elements).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(elements).on(events, selector, data, handler);        // jQuery 1.7+

---

可能是一个迟到的重复答案，但这可能是一个迟到，但这是我做的，当我需要ajax

$(document).ready(function () {
$(document.body).on('click', '.Selector_S', function () { function_F(event, this) })
}

function function_F(event, d){
...do sth here...
}

---

您根本不需要重新初始化事件监听器，也不需要在ajax函数中编写任何内容。

我更喜欢这种方法，因为它为您提供了将事件监听器用于“常规”和ajax内容的选项。在第一个答案中，它假设您只需要该侦听器一次。您的方法无法处理创建的asychrone div。。。以防div已经存在