Question

我有这个jquery代码，允许我点击一个链接来获取它的父级并在另一个地方更改一些值：

$("a.menu_filter_select").click(function(){
  var parent_filter = $(this).parent("tr");
  // Update value
  parent_filter.find(".filter_value").html($(this).html());
});

问题是它在 $（this）上得到一个空值，这是一个意想不到的行为，我不明白为什么它不起作用，任何想法？

这是在方法中使用断点的控制台调试：

$(this)
> null
this
> <a class="menu_filter_select" href="http://localhost:3000/#" rel="1">test</a>

Answer 1

我认为这是因为你的函数接收一个事件作为参数，你需要event.target。

$('a.menu_filter_select').click(function(evt) {
    var parent_filter = $(evt.target).closest('tr');

我还建议使用closest代替parent，因为即使有人在锚点附近放置<b>，<i>或<span>，您的代码也会有效。我还使用find代替child。

编辑：事实上，FireFox中的this引用了锚点对象，但我无法确定它是否在其他浏览器中以相同的方式实现。但是 event.target可以引用子对象，如果文档是这样的话：

<a><b>some text</b> other text</a>

然后这个事件处理程序可以输出不同的元素：

$(a).click(function(event) { console.log(this, event.target); });

尝试在FireBug中运行此代码，看看它是如何工作的。

Answer 2

我能想到的唯一原因是标识符$已被重新定义。

您可以检查功能中是否$ == jQuery。如果不是，那么您可能还包含了另一个使用$标识符的脚本。

如果存在另一个也使用该标识符的库，则会使用jQuery的兼容模式，其中它将$标识符的值返回到其原始值，并使用{{1}而是标识符。

Answer 3

偶尔$和jQuery之间的绑定可能会失败，请尝试用jQuery替换$。

还尝试使用$ .log而不是断点来确保此范围不会发生变化。

Answer 4

我个人总是在使用jquery时使用$，但我已经看到这种情况发生在我使用jquery而不是$的插件中。出于某种原因，它不喜欢使用两者，但只是将jquery更改为插件代码中的$，为我排序。

$（this）在.click（function（）{...}）里面是空的，为什么？

4 个答案: