在事件处理程序中获取选择器答案

【问题标题】：Get selector in event handler在事件处理程序中获取选择器
【发布时间】：2011-06-24 15:11:58
【问题描述】：

我用这个 jQuery 代码回答了this question：

$('input[type="checkbox"][name$="chkSelect"]').click(function() {
  $('input[type="checkbox"][name$="chkSelect"]').not(this).prop("checked", false);
});

...这让我想到：必须有一种方法可以避免在事件处理程序中重复选择器。

我尝试了$(this).selector，但这只是返回一个空字符串。 Here's a demo.

有没有办法在事件处理程序中获取选择器文本？

【问题讨论】：

you're $('____').selector 只是返回 __，您可以尝试使用 $('abcdefgi").selector.. 之类的任何东西。
我在您的示例中得到了正确的选择器 (div)。（我使用的是 FF 5）
@maenu：我认为你没有点击元素；）
@mazlix：我不明白你的意思——在第一个例子中，div 被返回。在第二个（单击）示例中，返回空字符串。你看到了什么不同的东西吗？
@mazlix：没错，因为在那种情况下allyourbasearebelongtous 是选择器（尽管您不会看到任何返回的元素！）。 alert 在参数上隐式调用toString，所以alert(this) 与alert(this.toString()) 相同，显示[object HTMLDivElement]。 alert($(this).selector) 显示从 this 创建的 jQuery 对象的 selector 属性，但在我的演示上下文中它是空的，因为底层元素 this 是一个 DOM 元素，它不知道它是如何被选择的。希望这是有道理的！ :)

标签： jquery

【解决方案1】：

$(this).selector 不起作用，因为您创建了一个 new jQuery 对象并传递了一个 DOM 元素，而不是选择器。

如果只想避免重复选择器，可以预先缓存元素（反正这样更好）：

var $elements = $('input[type="checkbox"][name$="chkSelect"]');
$elements.click(function() {
    $elements.not(this).prop("checked", false);
});

但我认为没有办法将选择器放入事件处理程序中。您对所选元素的唯一引用是相应的 DOM 元素（通过this）。但是您不能从中“逆向工程”选择器。

【讨论】：

我知道你会是回答这个 Felix 的人，干杯 :) 我想出了第一点（this 是 DOM 元素）但我想在那里可能是获取选择器的“好”方式。我想缓存它是下一个最好的事情，而且它意味着更少的打字，这在星期五下午总是很好;）
@Town: 正是:) 星期五快乐 :)

【解决方案2】：

你总是可以这样做的：

for(var i in arr){
  $(arr[i]).bind('click', {'selector': arr[i]}, function(event){
    console.log(event.data.selector);
  });
}

【讨论】：

【解决方案3】：

这家伙似乎已经做到了。 How do I get a jQuery selector's expression as text? - 见 Pim Jager 的回答

【讨论】：

干杯布兰登。我确实看到了，但是 这远非最佳，但在某些情况下有效 行加上它超过几行的事实让我失望；）我认为缓存选项是最好的.
我也不确定它是否重复 - 虽然问题的本质是相同的，但上述链接中接受的答案构成了我原来问题的一部分 - 所以我认为它是与其说是重复，不如说是一种进步！ :)
@Town - 哈，我在发布后也看到了那条线。有趣的解决方案，但是从我的角度来看，“某些情况”并不是“足够的情况”。很高兴您能找到可接受的解决方案！

【解决方案4】：

$('div').click(function() {
    alert($(this)[0].nodeName);
});

【讨论】：

如果您仅根据元素名称选择元素，则该方法有效。如果你有一个更复杂的选择器，那么你就不走运了。锁定@Tom 链接到的答案。
只要选择器直接转换为节点就可以了。如果您将选择器更改为例如：#myDiv，则它会失败。