Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Uncaught TypeError: Object [object Object] has no method 'on'

Can anyone help me to figure this out ?

When I use the latest (or a newish) version of jQuery, the small script below works fine. However, when I use older versions of jQuery, my script says that the on function does not exist.

Here is my script that doesn't work with older versions of jQuery:

$(document).ready(function () {
    $(".theImage").on("click", function(){
        // In the event clicked, find image, fade slowly to .01 opacity
        $(this).find("img").fadeTo("slow", .01).end()
        // Then, of siblings, find all images and fade slowly to 100% opacity
               .siblings().find("img").fadeTo("slow", 1);           
    })
})

Any kind of help is appreciated.

like image 351
dvlden Avatar asked Jun 06 '12 10:06

dvlden


3 Answers

You must use bind instead of on, as on was only introduced in jQuery 1.7.

$(document).ready(function () {
    $(".theImage").bind("click", function(){
        // In the event clicked, find image, fade slowly to .01 opacity
        $(this).find("img").fadeTo("slow", .01).end()
        // Then, of siblings, find all images and fade slowly to 100% opacity
        .siblings().find("img").fadeTo("slow", 1);           
    })
})
like image 190
Aelios Avatar answered Nov 19 '22 18:11

Aelios


You could use delegate(), for example:

$("table").delegate("td", "click", function() {
  $(this).toggleClass("chosen");
});

This is equivalent to the following code written using on():

$("table").on("click", "td", function() {
  $(this).toggleClass("chosen");
});
like image 24
raycchan Avatar answered Nov 19 '22 20:11

raycchan


You must use jQuery version 1.7+ to use on(). bind() is deprecated.

like image 1
Mohammad Rahmani Avatar answered Nov 19 '22 20:11

Mohammad Rahmani