jQuery 委托表行选择器答案

【问题标题】：jQuery delegate table rows selectorjQuery 委托表行选择器
【发布时间】：2010-05-31 08:04:47
【问题描述】：

我有一个可能包含其他内部表的表（无法编辑生成的标记）。我想为行 mouseenter 和 mouseleave 创建一个委托函数，它只触发关联的主表行（而不是内表行），如下所示：

  $("#tableid").delegate("tr", "mouseenter mouseleave", function(e) {
    //do stuff here
  });

但是有了这个选择器，它也会选择内表行，那么如何修改选择器以避免选择内表行呢？

【问题讨论】：

【解决方案1】：

您可以将.delegate() 与稍有不同的选择器一起使用，如下所示：

$("#tableid").delegate("#tableid > tbody> tr", "mouseenter mouseleave", function(e) {
  //do stuff, for example $(this).toggleClass("hover");
});

这很有效，因为您希望 <tr> 元素是直接子行，但您需要考虑到 <tbody> 之间的关系。 You can test a working demo here.

【讨论】：

嗯，没有意识到，为 the 答案+1。
你认为"> tbody > tr"不被支持是个bug吗？表 id 必须在委托选择器中重复？
@Crescent - 我不认为这是一个错误，任何具有必须在每次事件发生时独立检查的上下文都不能整体相对，至少我不'不知道怎么做。您需要一个绝对或独立的相对选择器，例如 "tbody > tr" 有效（但不适用于这个问题），但 starting 使用相对选择器会使它相对于...？请记住，.delegate() 您正在将处理程序附加到元素，只是（可能）使用选择器来执行此操作，但之后它被丢弃了，不像 live 继续使用它，但它不能相对于 context.