jQuery текущая цель в множественном выборе

Question

как я могу узнать, какой из моих вариантов выбора является моей "текущей" целью?Я хотел бы иметь разные переменные внутри этой функции.

$('#header a, #nav a').click(function (event) {

// if is $('#header a')  do this
// if is $('#nav a')  do that   

});

Answer 1

this будет ссылаться на фактический элемент DOM, поэтому вы можете проверить tagName или className, или искать $(this).parents('#header').

$('#header a, #nav a').click(function (event) {
  var $this = $(this);

  if ($this.parents("#header").length > 0) {
    display("I'm inside #header");
  }
  else if ($this.parents("#nav").length > 0) {
    display("I'm inside #nav");
  }
  else {
    // Obviously this won't happen.
    // None of us has *ever* changed a selector and forgotten to update the code! ;-)
    display("I'm confused!");
  }

  return false;

});

Живой пример

---

Не по теме : Я согласен с Феликсом и Меласом, что, если вы действительно делаете что-то другое, рефакторинг в отдельные обработчики (возможно, вызов общих функций), вероятно, лучший путь ...

Answer 2

this относится к текущему элементу в коллекции совпадений для селектора / селекторов. Однако, если вам нужно обрабатывать каждый элемент по-разному, зачем связывать событие click для элементов как группы (т. Е. С помощью одного селектора).

Чтобы лучше управлять кодом, я бы использовал два вызова связывания:

$("#header a").click(function (event) {
 //Do what you need to do for #header a
}); 

$("#nav a").click(function (event) {
 //Do what you need to do for #nav a
});