How to return variable value from jQuery event function?

jQuery Web Development Front End Technology

You cannot return variable value from jQuery event function. To understand the reason, let us see how data is passed, which was created in the event handler of a button click.

Example

Live Demo

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    var a=document.getElementById('demo');
    a.addEventListener('click', function(){
       var s='Hello World!';
       var event = new CustomEvent('build', { 'detail': s });
       this.dispatchEvent(event);
     })

    document.getElementById('parent').addEventListener('build', getData, true);

    function getData(e){
       alert(e.detail);
    }
});
</script>
</head>
<body>

<div id='parent'>
<button id='demo'>Click me</button>
</div>

</body>
</html>

Amit D

Updated on: 17-Feb-2020

2K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started