запуск пользовательского события без jQuery
Я запускаю некоторые события DOM с помощью jQuery triggerHandler()
<!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?
Важно : мне нужно знать тип события и пользовательские данные
2 ответа:
Если вы хотите точную репликацию поведения 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'}}));
Вы можете использовать пользовательские события и отправлять их на нужный элемент.