Why `$('audio').trigger(play)` fires playHandler twice while `$('audio')[0].play()` only fires once?

Question

I used to think trigger(play) just fires the native play function of audio, but today I just noticed that there is a slight difference between these two methods. If you register a callback for play, e.g. $('audio').on('play', function() { console.log('playing'); }), the callback will be invoked twice if you use trigger(play) but only once when using play().

• How come this discrepancy?
• Is it possible to make trigger(play) only fires the play callback once, so as to keep potential bugs away?

[demo]

---

Update

In the demo, I call trigger('play') and trigger('pause') and then play() and pause(). The result is

// the following four lines are generated by trigger calls
play 
play
pause
pause
// the following two lines are generated by native calls
play
pause

This demo could illustrate what I'm talking about.

This problem could be reproduced on:

• Chrome version 46.0.2490.86 m
• IE 11.0.9600.18053
• FireFox 42.0