триггер пользовательского события без JQuery

Я запуск некоторых событий DOM с JQuery triggerHandler()триггер пользовательского события без JQuery

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title>stackoverflow</title> 
 
    <script src="http://ajax.googleapis.com:80/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <script> 
 
    $(document).ready(function() { 
 
     $(document).on('hey', function(customEvent, originalEvent, data) { 
 
     console.log(customEvent.type + ' ' + data.user); // hey stackoverflow 
 

 
     }); 
 

 
     // how to this in vanilla js 
 
     $(document).triggerHandler('hey', [{}, { 
 
     'user': 'stackoverflow' 
 
     }]) 
 
    }); 
 
    </script> 
 
</body> 
 

 
</html>

Как я могу вызвать это без JQuery?

Важно: Мне нужно знать тип события и пользовательские данные

источник

2015-04-27 Christian Haller

Под обложками JQuery будет использовать document.addEventListener ('эй', функция() {...}); где эй клик, mousedown и т. д. Это то, что вы имеете в виду? – garryp

Чтение источника jQuery покажет вам, как это делается, поскольку jQuery - это JavaScript. –

Насколько я помню, jquery объединяет '.dispatchEvent' и' .fireEvent' для triggerHandler. Вы можете легко написать функцию, чтобы попробовать тот или иной. событие отправки будет работать в большинстве браузеров. – David

Если вам нужна точная копия поведения jQuery, то вы, вероятно, лучше всего разбираетесь в jQuery source code.

Если вы хотите просто обычную диспетчерскую отправку и прослушивание, см. CustomEvent о том, как отправить событие с пользовательскими данными и addEventListener, как его слушать.

Ваш пример, вероятно, выглядеть как

document.addEventListener('hey', function(customEvent) 
{ 
    console.log(customEvent.type + ' ' + customEvent.detail.user); // hey stackoverflow 
}); 
document.dispatchEvent(new CustomEvent('hey', {'detail': {'user': 'stackoverflow'}}));

источник

2015-04-27 14:24:28 Siguza

Конструктор 'CustomEvent' не поддерживает в IE. – Johnston

@Johnston Но похоже, что есть [polyfill for it] (https://github.com/krambuhl/custom-event-polyfill/blob/master/custom-event-polyfill.js). – Siguza

Да, и он отлично работает – Johnston

Вы можете использовать Custom Events и направить их на элемент, который вы хотите.

источник

2015-04-27 14:23:56

триггер пользовательского события без JQuery

ответ

Смежные вопросы