JQuery - Различие между event.target и этим ключевым словом?

Между чем различие event.target и this?

Скажем, я имею

$("test").click(function(e) {
    $thisEventOb = e.target;
    $this = this;
    alert($thisEventObj);
    alert($this);
});

Я знаю, что предупреждение вытолкает другое значение. Кто-либо мог объяснить различие? Миллион благодарностей.

9
задан lorond 24 August 2016 в 09:53
поделиться

2 ответа

Они будут такими же, если вы щелкнете по элементу, к которому настроено событие. Однако, если вы щелкнете по дочернему элементу , и он всплывает, то this относится к элементу, к которому привязан этот обработчик, а e.target по-прежнему относится к элементу элемент, из которого произошло событие.

Вы можете увидеть разницу здесь: http://jsfiddle.net/qPwu3/1/

с учетом этой разметки:

<style type="text/css">div { width: 200px; height: 100px; background: #AAAAAA; }​</style>    
<div>
    <input type="text" />
</div>​

Если у вас было это:

$("div").click(function(e){
  alert(e.target);
  alert(this);
});

Щелкните предупредит ввод, а затем div, потому что ввод инициировал событие, div обработал его, когда оно всплыло. Однако, если бы у вас было следующее:

$("input").click(function(e){
  alert(e.target);
  alert(this);
});

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

18
ответ дан 4 December 2019 в 10:31
поделиться

События могут быть прикреплены к любому элементу. Однако они также применимы к любым элементам в указанном объекте.

this - это элемент, с которым связано событие. e.target - это элемент, по которому действительно щелкнули.

Например:

<div>
  <p>
    <strong><span>click me</span></strong>
  </p>
</div>
<script>$("div").click(function(e) {
  // If you click the text "click me":
  // e.target will be the span
  // this will be the div
});  </script>
2
ответ дан 4 December 2019 в 10:31
поделиться
Другие вопросы по тегам:

Похожие вопросы: