$ (this) является нулевым внутри .click (function () {...}), почему?

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.

Редактировать: фактически, this в FireFox ссылается на объект привязки, но я не могу точно знать, реализован ли он таким же образом в других браузерах, НО event.target может ссылаться на дочерний объект, если, скажем, документ выглядит следующим образом:

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

, тогда этот обработчик событий может выводить различные элементы:

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

Попробуйте запустить этот код в FireBug, посмотрите, как он работает.

Answer 2

Единственная причина, по которой я могу придумать, состоит в том, что идентификатор $ был переопределен.

Вы можете проверить, если $ == jQuery в функции. Если это не так, то вы, вероятно, включили другой скрипт, который также использует идентификатор $.

Существует режим совместимости для jQuery, который будет использоваться, если есть другая библиотека, которая также использует этот идентификатор, где она возвращает значение идентификатора $ в исходное значение, и вместо этого вы используете идентификатор jQuery.

Answer 3

Лично я всегда использую $ при использовании jquery, но я видел, как это произошло, когда я включил плагин, который использовал jquery вместо $. По какой-то причине он не любит использовать оба, но просто изменив jquery на $ в коде плагина, я разобрался с ним.

Answer 4

Иногда связывание между $ и jQuery может быть неудачным, попробуйте заменить $ на jQuery.

Также попробуйте использовать $ .log вместо точки останова, чтобы убедиться, что область действия этого не меняется.