Воздействовать на щелкнутый элемент в функции обратного вызова

Я пишу некоторые функции JS для обработки щелчка элемента и обработки ответа JSON. Проблема, с которой я сталкиваюсь, связана со ссылкой на щелкнутый элемент вне функции щелчка.

HTML-макет:

<div class="container">
  <div class="link">
    <a href="#" onclick="linkify()">Test</a>
  </div>
  <div class="output">
    <textarea class="output-textarea"></textarea>
  </div>
</div>
<div class="container">
  <div class="link">
    <a href="#" onclick="linkify()">Test</a>
  </div>
  <div class="output">
    <textarea class="output-textarea"></textarea>
  </div>
</div>

И JS:

// link function
function linkify() {
    // save reference to click element
    activeElement = $(this);
    // make AJAX call
}

// callback function; the parameters of this function 
// are defined by an API and cannot be changed
function callback(json) {
    $(activeElement).closest('.container').find('.output-textarea').val(json);
}

jsFiddle здесь: http://jsfiddle.net/Lqaw05j8/4/

В моей скрипте событие срабатывает со всеми определенными переменными, но мой обход jQuery DOM не работает.


person HasecBinUsr    schedule 30.09.2014    source источник


Ответы (1)


Вам нужно передать this в качестве аргумента функции:

<a href="#" onclick="linkify(this)">Test</a>

function linkify(element) {
    // save reference to click element
    activeElement = element;
    // make AJAX call
}

Обратите внимание, что использование такой глобальной переменной — не лучший способ передать контекст обратному вызову. Если пользователь щелкнет другой элемент до того, как сработает обратный вызов, он изменит активный элемент. Рассмотрите возможность использования параметра context: для $.ajax() для передачи контекста или сделайте функцию обратного вызова замыканием.

person Barmar    schedule 30.09.2014
comment
И вызов AJAX, и обратный вызов жестко закодированы в API и не могут быть изменены, поэтому я пытаюсь обойти это ограничение. Есть ли лучший способ сделать это без изменения вызова AJAX или параметров обратного вызова? - person HasecBinUsr; 30.09.2014
comment
если вы не передадите параметр, linkify() не сможет узнать, какой элемент был нажат. В некоторых браузерах есть глобальная переменная event, поэтому event.target будет работать, но я не думаю, что это работает в Firefox. - person Barmar; 30.09.2014