Помогите разобраться в коде
Всем привет!
У меня есть вот такой код:
$('body').on('click', '.trigger', function(e){
e.preventDefault();
$('#test-modal').modal().open();
Вопрос! зачем перед preventDefault() использовать параметр e |
Беда, беда...
Ок. Зачем перед .on(...) использовать $('body') ? Зачем перед .modal() использовать $('#test-modal')? Зачем перед .open() использовать $('#test-modal').modal()? preventDefault - это свойство объекта e (его метод). Если быть точнее - это свойство прототипа объекта e (который ссылается на Event.prototype). |
вот код, в котором я пытаюсь разобрать логику открытия модального окна
jQuery(function($){ //jQuery - эти озночает, что дальше идет код jQuery; $ в данном контексте - переменная
// bind event handlers to modal triggers
$('body').on('click', '.trigger', function(e){ //$() - начало использования скрпта jQuery, параметр $() - ссылка на контейнер html, .on() - вызов некого события, "click" - тип вызываемого события, ".trigger" - идентификатор объекта, к которому применяется событие,function() - это фукция, которая выполняется в случае возникновения события.
e.preventDefault();//метод preventDefault() отменяет стандартную реакция на событие
$('#test-modal').modal().open();//modal().open(); - открывает модальное окно, описанную в контейнере с идентификатором #test-modal
});
// attach modal close handler
$('.modal .close').on('click', function(e){
e.preventDefault();
$.modal().close();
});
// below isn't important (demo-specific things)
$('.modal').on('click', function(e){
e.stopPropagation();
$('.modal').toggle();
});
});
<body> <div class="modal" id="test-modal" style="display: none"> <a href="#" class="close">×</a> <object class="Clip"> <param value="Belissimo.swf" name="movie"> <embed src="Belissimo.swf"> </object> </div> <a href="#" class="trigger">Open modal</a> </body> Не понятно, что такое объект е в данном контексте? |
В функцию-обработчик события передается объект. e - это сокращение от event.
Сделайте console.log(e) да посмотрите какие свойства имеет этот объект. Например для событий мыши в объекте можно найти координаты x/y, элемент, на котором возникло событие, номер кнопки мыши, которую нажали, состояние кнопок-модификаторов (Ctrl, Shift, Alt) методы stopPropagation, preventDefault и тд. Стоит заметить что jQuery передает свой объект, не нативный - в целях достижения кроссбраузерности. Но также есть и ссылка на нативный объект e.originalEvent, доступ к которому обычно не требуется. |
понятно) danik.js, спасибо за разъяснения
|
| Часовой пояс GMT +3, время: 20:18. |