Search code examples
jqueryevent-handlingjquery-eventscustom-events

How to trigger custom event with jQuery?

I'm attaching a custom event handler to the body in jQuery's ready method.
Afterwards I immediately trigger the custom event but nothing seems to happen.

$(function(){
    $("body").on("test", function(){ alert("test triggered"); }
    $("body").trigger("test");
}
Solution

  • Firstly you have a syntax error

    $(function(){
    $("body").on("test", function(){
        alert("test triggered");
    });  < ---- Missing this
    $("body").trigger("test");
});

    Secondly you cannot trigger the event from the console , as $(function() {}); forms a closure and you will not have access to any of the methods inside them

    For it to work like you are expecting , put a debug point in your script file and then try to trigger the event. It works now as the events are in scope.