Question

所以我们都知道在ajax更新事件中必须反弹到新的dom元素。是委托是一种选择，但委托并不适用于所有情况。例如，委托对于只需要在加载时而不是在点击事件上完成的事情不会提供帮助。

我宁愿将代码拆分为需要在更新上反弹的委托处理程序和处理程序，而是定义一个带有上下文参数的方法，每次页面更改时都会调用它：

function onPageUpdate(context) {
     $('a', context).click(...); // event handlers
     $('.chart', context).addClass(...); // load handlers

}

在dom ready上，将使用context参数null调用它。在ajax更新中，上下文将容纳新的dom元素。这样我就再也不用担心再次委派或更新。

然而，我无法解决这个问题。鉴于ajax回调：

function onSuccess(data) {
    // data contains new dom elements like: <div><a>Click</a><span>chart<span></div>
    // replace old elements with new ones
    $('a').replaceWith('a', data);
    $('span').replaceWith('span', data);

    // call pageUpdate with the new context
    onPageUpdate(data);
}

是否有可能像我期望的那样完成这项工作？替换工作正常，但是onPageUpdate并没有将这些新元素绑定到任何内容，我不知道是不是因为上下文只是一个字符串对象或什么。任何人都可以想到一种方法来使这项工作吗？

在我看来，这是一个比委托更好的解决方案，因为只有一个方法适用于所有处理程序，只有需要绑定的元素才能拥有它。

Answer 1

来自jQuery() - jQuery API

jQuery（selector [，context]）

selector包含选择器表达式
的字符串
context用作上下文的DOM元素，Document或jQuery

如果上下文不是正确的类型 - 例如传递一个字符串 - 它就会被忽略。尝试将HTML字符串包装在jQuery对象中，然后将其用作选择器的上下文，如下所示：

var $context = $(data);
$('a').replaceWith('a', $context);
$('span').replaceWith('span', $context);

// call pageUpdate with the new context
onPageUpdate($context);

Answer 2

我不会回答你的问题，安东尼·格里斯特的答案是对的，但有些事你说我不理解。你能解释一下吗？

例如，委托对于仅在加载时而不是在点击事件上需要完成的事情没有帮助

很抱歉，但我没理解，你有例子吗？

在我看来，这是一个比代表更好的解决方案，因为theres 所有处理程序只有一种方法，只需要一个方法绑定将拥有它。

我也不明白：

only one method：你在谈论哪种方法？
only the elements ... will own it：委托也是如此，如果你说10个锚元素，只有一个处理程序被绑定，而不是你的解决方案中的10个

在您的方法onPageUpdate上，您混合了两件事：事件处理（$("a").click(...)）和DOM修改（$(".char").addClass(...)）。也许这就是为什么你对代表解决问题的能力感到困惑的原因。

JQuery Ajax - 使用上下文参数而不是委托重新绑定元素？

2 个答案: