Объект события Javascript не заполняется в функции обработчика событий

Question

У меня есть следующий код:

Html

<tr>
    <td onclick="ThingClicked()">click me</td>
</tr>

JS:

function ThingClicked(event) {
    var row = event.currentTarget.parent("tr");
    callAnotherDOMManipulatingFunction(row);
}

По какой-то причине event.currentTarget не определено. Я попробовал «это», но это тоже не определено. В чем дело? Как мне получить строку, в которой содержится этот тд?

Answer 1

Ну, так как вы включили тег jQuery (и включили ссылку на документы jQuery), я покажу вам, как это сделать.

РЕДАКТИРОВАТЬ:

jQuery live () документы

jQuery clone () документы

РЕДАКТИРОВАТЬ: Добавлена ​​функция ready () jQuery.Вы всегда будете размещать свой код внутри, как показано на рисунке.

$('document').ready(function() {
    $('td').click(function() {
        var row = $(this).closest('tr');
        callAnotherDOMManipulatingFunction(row);
    });
});

Конечно, это прикрепит событие щелчка к каждому тегу td, но вы поймете, что идея.

РЕДАКТИРОВАТЬ:

Дальнейшее объяснение.При использовании jQuery вы обычно назначаете события в своем javascript, а не в HTML.Присвоение 'td' даст событие click каждому тегу 'td' на странице, поэтому может случиться так, что вместо этого вы дадите классу 'td' и будете использовать его для прикрепления события, например:

$('.myFreakingAwesomeClass').click(function() {
    ...
});

Вам не нужно часто ссылаться на «событие», но иногда оно бывает полезно.

Answer 2

Попробуйте это:

<tr>
  <td onclick="javascript:ThingClicked(this);">click me</td>
</tr>

function ThingClicked(td) {
    callAnotherDOMManipulatingFunction(td.parentNode);
}

Answer 3

Попробуйте это:

<tr>
    <td onclick="ThingClicked(event)">click me</td>
</tr>

с входным параметром вашей функции-обработчика, специально названным event, и ничего больше.

Answer 4

Измените свой код следующим образом:

HTML:

<tr>
    <td onclick="ThingClicked(this)">click me</td>
</tr>

JS:

function ThingClicked(element) {
    callAnotherDOMManipulatingFunction(element);
}