Geek asks and answers

$ (". class"). on is not a function - jQuery error

I am new to Javascript / jQuery and I am trying to create a play button to play HTML5 video. My code is:

//return a jQuery object
var video = $('#myVideoTag');

//Play/Pause control clicked

$('.btnPlay').on('click', function() {
   if(video[0].paused) {
      video[0].play();
   }
   else {
      video[0].pause();
   }
   return false;
});

I keep getting this error:

$(".btnPlay").on is not a function
[Break On This Error]   

$('.btnPlay').on('click', function() {

I can’t find out in my life what’s wrong. I have a .btnPlay class correctly defined on the page. I am following a tutorial that seems to use the same method without problems. Any ideas?

+5
source share
3 answers

The method onwas introduced in jQuery version 1.7.

I think you need to upgrade the jQuery library to the latest version .

Otherwise, you can use bind:

$('.btnPlay').bind("click", function() {
    // ...
});

or its quick access method click:

$('.btnPlay').click(function() {
    // ...
});
+8

jQuery 1.7, .delegate() .on(). .delegate().

.live(), 1.7 . jQuery .delegate(), .live().

+1

An alternative to the .on method in older versions of javascript is .delegate. You must use .delegate('.btnPlay', 'click', function(){...})in the parent to have the same functionality

0
source

More articles:


All Articles