Тест кода:
Кода -копия выглядит следующим образом:
<div id = "test"> <p> Тестовый текст <p> </div>
<script src = "vendor/jquery-2.1.1.js"> </script>
<Скрипт>
test.addeventlistener ('click', function (e) {console.log (e);}, false),
$ ('#test'). on ('click', function (e) {console.log (e)});
</script>
Анализ результатов:
Кода -копия выглядит следующим образом:
js-jq-event-common: {
Альтки: ложь,
пузыри: правда,
кнопка: 0,
Отмена: правда,
ClientX: 58,
Клиент: 13,
ctrlkey: ложь,
Offsetx: 50,
OffSety: 5,
Pagex: 58,
Pagey: 13,
ScreenX: 58,
Screeny: 122,
Просмотр: окно,
Что: 1,
Тип: «Нажмите»,
TimeStamp: 1407761742842,
МЕТАКИ: Неверно,
Связанный
Цель: Div#тест /*Цель JQ-EVT не обязательно является элементом, который соответствует селектору jQuery, это может быть первый элемент, который захватывает событие, а затем пузырится вверх, одним из них является элемент, который соответствует селектору* / /
},
js-jq-event-diff: {
CurrentTarget: null/*кажется, что это обычно null*/
|| Div#тест/*jq selecter совпадает с элементами в атрибуте [currentTarget]*/,
Eventphase: 0 || 2,
TOELEMENT: DIV#тест
},
js-event-solo: {
x: 58,
y: 13,
CancelBubble: ложь,
charcode: 0,
Boolbebboarddata: Undefined,
DataTransfer: null,
DefaultPrevented: False,
Srcelement: Div#тест,
от элемента: null,
Подробности: 1,
Ключевой код: 0,
Layerx: 58,
Слой: 13,
returnValue: true
},
jq-event-solo: {
кнопки: неопределенные,
Данные: неопределенные,
DelegateTarget: Div#тест/*Кто слушает? Это элемент. */,
isdefaultprevented: функция,
handleobj: объект,
jquery211024030584539286792: true,
OriginaleVent: Mouseevent,
ShiftKey: ложь
}
Body-Click-Delegate-Event: {
CurrentTarget: htmlBodyElement,
DelegatetArget: htmlbodyElement,
Цель: htmldellement
}
Суммировать:
В случае параметра событий JS, будь то цель, предмет, носильщики и обмену, они указывают на первый элемент, который запускает событие (еще не пузырится), а от элемента является нулевым в событии Click. Поэтому, если вы установите родительское событие с большим количеством элементов, событие запуска, вероятно, станет дочерним элементом этого родителя.
Поэтому в фактическом приложении, если вы хотите ссылаться на родителя, вы можете только использовать это только
В параметре события JQ,
CurrentTarget - это элемент, который соответствует вашему селектору, который является элементом, который вы хотите;
Delegatetarget - это элемент, который прислушивается к событиям и принадлежит делегированному элементу.
Цель в параметре события того же JS является первым элементом, который запускает событие, и это не так полезно, как CurrentTarget (не обязательно, например, приложение в событии BodyClick)
Некоторые студенты могут сказать, что вам нужно напрямую ссылаться на элементы события устройства и использовать это. Зачем понимать CurrentTarget и Target? Эта идея доказывает, что вы просто используете jQuery и никогда не использовали такие инструменты, как Backbone.
Магистраль связывает это во многих местах, поэтому использование этого в своих функциях невозможно:
Кода -копия выглядит следующим образом:
var view = backbone.view.extend ({
EL: Document.Body,
события: {
'Нажмите P': 'ShowText' // делегировать тело, чтобы прослушать событие P Click},
ShowText: function (e) {
var p = e.currenttarget; // [currentTarget] Получить элемент, соответствующий селектору this.log (p.innerhtml); // я видел это, это не указывает на элемент P},
log: function (msg) {
console.log (msg);
}
});
Хотя объекты события в JS и JQ похожи, все еще есть некоторые различия. Вы понимаете?