Ajax 在动态创建的元素上触发了很多次答案

【问题标题】：Ajax fires a lot of times on dynamically created elementsAjax 在动态创建的元素上触发了很多次
【发布时间】：2013-11-01 17:22:06
【问题描述】：

我正在使用这个插件 jrating。 https://github.com/alpixel/jRating.

HTML

<button class="btn">ADD</button>


<div id="doc"></div>

JQUERY

$(document).on('click', '.btn', function () {
    $('#doc').append('aaa<div class="rating" id="0_5"></div>');
    $('.rating').jRating();
});
$('.rating').jRating();

当我将新的 div 动态添加到 doc 时。如果我不在点击功能中使用$('.rating').jRating();，评级不会显示。

问题：当我动态附加四个 div 并单击第一个附加的 div 时，ajax 会触发 4 次。这适用于 4 所有其他元素。就像单击第 3 次附加 div 3 次，第 2 次 2 次一样。不知道为什么会这样

小提琴：http://jsfiddle.net/TFWXG/

【问题讨论】：

标签： jquery plugins jquery-plugins

【解决方案1】：

当您在点击处理程序中执行$('.rating').jRating(); 时，您会一次又一次地为页面中存在的所有rating 元素初始化插件，而不是只为新元素初始化

$(document).on('click','.btn',function(){
   $('aaa<div class="rating" id="0_5"></div>').appendTo('#doc').jRating();    
});

【讨论】：