1

I am currently using following binding in angularJS controller. I am having problem of the event being bound multiple times. Is there a way to bind events to a specific element?

Let's say I have 2 videos like this:

<video id="video1"></video>
<video id="video2"></video>

JS

This works 

$(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange', function (e){
    //Do stuff like unmute video
});

This doesn't work. I thought this should work.

$(document.getElementsByTagName("video")[0]).on('webkitfullscreenchange mozfullscreenchange fullscreenchange', function (e){
    //Do stuff like unmute video
});
Firze
  • 3,939
  • 6
  • 48
  • 61
  • Why are you mixing jQuery with plain JS? `$(document.getElementsByTagName("video")[0])`? Why not just `$('video:eq(0)')`? – putvande Sep 09 '15 at 12:11
  • I don't know. Just trying out different stuff and getting messed up, but it has nothing to do with the question... – Firze Sep 09 '15 at 12:24
  • Just a thought, how about using ```e.target```? would that bee the video node? something like this: ```$(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange', function (e){ var $videoElement = $(e.target); /* do things with video element that linked to screenchange event */ });``` The reason could be similar to: http://stackoverflow.com/questions/11291651/why-dont-audio-and-video-events-bubble – Varinder Sep 30 '15 at 06:31

0 Answers0