0

我有一些特殊的 pb：我通过 ajax 请求动态创建一些列表和类 'myclass' 的 div，然后单击它们，我称之为在输入区域中添加一些 url，然后将一些源添加到 iframe，在弹出窗口中显示

$(document).on("click", "li .myclass", function () {
    var uri = $(this).closest('li').attr("id");
    var embed = 'https://www.youtube.com/embed/';
    $('#myinput').val(val + uri);
    $('#wrapper iframe').attr('src', embed + uri);
});

然后点击弹出窗口的按钮，我触发点击#mybutton，创建一些文本区域

$(document).on("click", ".popup button", function () {
    event.preventDefault();
    $('#mybutton').trigger('click');
    $('#myinput').val('');
});

我的问题是我第一次单击“li .myclass”时，它会干净地创建一个文本区。但是如果我第二次单击，它会创建三个文本区域，然后如果我第三次单击，它会创建 6 个文本区域。我真的不明白这种行为，有人可以帮忙吗？

4

2 回答 2

3

尝试替换这个：

$(document).on("click", "li .myclass", function () {

有了这个：

$("li .myclass").on("click", function () {

您使用带有“选择器”参数的 jQuery on方法的方式有点危险。它需要了解事件冒泡，并且可能是触发多个事件的来源。

于 2013-02-12T17:23:23.297 回答
1

我们必须 stopPropagation() 以避免 Clicks 触发事件的次数过多。

$(this).find('#cameraImageView').on('click', function(evt) {
evt.stopPropagation();
console.log("Camera click event.");
});
于 2015-01-20T05:17:17.713 回答