Search code examples
jquerytriggersbindjquery-eventscustom-events

jQuery trigger not firing with bind() or on() for custom events


Can anyone tell me why this code would not be working?

$('body').on('test', function() {
  alert('test');
});

$('body').trigger('test');

I'm using jquery-1.7.2.min. I do not get any errors, just nothing happens.

I've tried putting the code inside an inline script, inside a $(document).ready() and still nothing. I've also tried both on() and bind() and neither result. I see examples all over showing the same syntax, so what is different with this?


Solution

  • It appears the issue lies in the DOM being ready somehow. Placing the code within inline script would not work. Placing it inside of a $(document).ready() will work with an anonymous function, but for some reason not a function call with '( )'.. This code worked

    $(document).ready(start);
    function start(){
    $('body').on('test', function() {
      alert('test');
    });
    
    $('body').trigger('test');
    }
    

    But this did not... *notice the function call parenthesis.

    $(document).ready(start());
    function start(){
    $('body').on('test', function() {
      alert('test');
    });
    
    $('body').trigger('test');
    }
    

    An exact example works both ways on jsfiddle, but for some reason only one way works on my server. Which I guess bring up another question of why, but at least we can see this code does in fact work, there is some strange anomaly with my stuff :/