Question

这对我来说很好，真的很难过。在搜索了最后几个小时后，我似乎无法解决我出错的地方。

我试图在点击时向容器附加一个AJAX响应。这工作正常但我不希望它在AJAX响应中的元素被点击时附加另一个对象....所以：

<div id="container">
    <!-- AJAX response to get inserted here, for example -->
    <span id="ajaxResponse"></span>
</div>

这是我的剧本：

$('#container').click(function(e) {
    var current_el = $(this).get(0);

    $.ajax({
        url: 'text.html',
        success: function(data) {
            $(current_el).append(data);
        }
    });
    return false;
});

所以它工作正常但是由于某种原因，当我点击AJAX响应范围时，#container上的click事件也会触发！？

根据jQuery文档：

停止进一步的处理程序在使用一个绑定后执行 .live（），处理程序必须返回假。调用.stopPropagation（）会没有做到这一点。

但除非我弄错了，否则我称之为虚假？：（

有人帮我解决这个问题吗？

更新：

所以我能让它工作的唯一方法是将我的代码更新为：

$('#container').live('click', function() {
    var current_el = $(this).get(0);

    $.ajax({
        url: 'text.html',
        success: function(data) { 
            $(current_el).append(data);
        }
    });
});

$('#ajaxResponse').live('click', function(e) {
    return false;
});

虽然这看起来有点混乱......任何人都有更好的解决方案吗？

Answer 1

您在问题标题中提到的live部分在哪里？

事件模型是如何工作的。如果单击不处理事件的元素，事件将沿DOM层次结构向上移动，直到找到处理点击的元素（并停止其传播。 的）。否则，您将无法将图像放在<a>标记内并单击它。

你可以在内部元素上绑定一个取消处理程序，假设你有某种目标它。

$.ajax({
    url: 'text.html',
    success: function(data) {
        $(current_el).append(data);
        // assuming the returned data from ajax are wrapped in tags
        $(current_el).children().click(function(){ return false;});
    }
});

Answer 2

我认为返回false是指在这种情况下的其他内容...... 你应该尝试调用stopPropagation（） - 这应该阻止“click”函数向下传播到ajaxResponse span ....

Answer 3

您可能想尝试的一个选项是切换到使用live（）。基本上，您设置的click事件是调用bind（），而您引用的解决方案是使用live（），它是bind（）的变体。

例如：

$('#container').live("click", function(e) {
    var current_el = $(this).get(0);

    $.ajax({
        url: 'text.html',
        success: function(data) {
            $(current_el).append(data);
        }
    });
    return false;
});

HTH

返回false不适用于jQuery live

3 个答案: