Между чем различие event.target
и this
?
Скажем, я имею
$("test").click(function(e) {
$thisEventOb = e.target;
$this = this;
alert($thisEventObj);
alert($this);
});
Я знаю, что предупреждение вытолкает другое значение. Кто-либо мог объяснить различие? Миллион благодарностей.
Они будут такими же, если вы щелкнете по элементу, к которому настроено событие. Однако, если вы щелкнете по дочернему элементу , и он всплывает, то 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);
});
Он всегда будет предупреждать ввод дважды, потому что это и исходный элемент для события, и тот, который его обработал.
События могут быть прикреплены к любому элементу. Однако они также применимы к любым элементам в указанном объекте.
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>