$().live is not a function - JavaScript/jQuery

Question

In Firefox I suddenly got this message from firebug:

$('a.close, #fade').live is not a function

Indeed, when I click the image gallery and popup displays. I cannot close out of it. The click event never registers due to this error message.

This is script:

        $('a.poplight[href^=#]').click(function() {
        var popID = $(this).attr('rel');  
        var popURL = $(this).attr('href');  

        var query= popURL.split('?');
        var dim= query[1].split('&');
        var popWidth = dim[0].split('=')[1];  

        //Fade in the Popup and add close button

        var div_popup = document.createElement('div');
        div_popup.setAttribute('id',popID);
        div_popup.setAttribute('class','popup_block');
        document.body.appendChild(div_popup);

        $(div_popup).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="close_pop.png" class="btn_close" title="Close Window" alt="Close" /></a> <a href="thumbBg' + $(this).attr('rel').substring($(this).attr('rel').lastIndexOf('p') + 1,$(this).attr('rel').length) + '"></a><p>The Human Diet: By Rene Endara</p>');

        var popMargTop = ($('#' + popID).height() + 80) / 2;
        var popMargLeft = ($('#' + popID).width() + 80) / 2;

        $('#' + popID).css({
            'margin-top' : -popMargTop,
            'margin-left' : -popMargLeft        
        });

        $('body').append('<div id="fade"></div>');  
        $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); 
        return false;
    });

    //Close Popups and Fade Layer
    $('a.close, #fade').live('click', function() {  
        $('#fade , .popup_block').fadeOut(function() {
            $('#fade, a.close').remove();  //fade them both out
        });
        return false;
    });

markup:

    <ul class="thumb">
    <li><a href="#?w=500" rel="popup1" class="poplight"><img src="images/thumb1.jpg" alt="" /></a></li>
    <li><a href="#?w=500" rel="popup2" class="poplight"><img src="images/thumb2.jpg" alt="" /></a></li>
    <li><a href="#?w=500" rel="popup3" class="poplight"><img src="images/thumb3.jpg" alt="" /></a></li>
    <li><a href="#?w=500" rel="popup4" class="poplight"><img src="images/thumb4.jpg" alt="" /></a></li>
   </ul>

Thanks for response.

What version of jQuery are you using? – Marko Nov 03 '10 at 01:46 — Marko, Nov 03 '10 at 01:46
Good call @Marko. .live was not introduced until jQuery 1.4 – Dennis Burton Nov 03 '10 at 01:52 — Dennis Burton, Nov 03 '10 at 01:52

score 27 · Answer 1 · edited May 23 '17 at 12:17

27

http://api.jquery.com/live/

Since .live() is deprecated as of jQuery 1.7+, you have to use either .on() or .delegate().

See related question jQuery 1.9 .live() is not a function on how to migrate existing code.

edited May 23 '17 at 12:17

Community

1
1

answered Jul 17 '12 at 16:13

Abhishek Mehta

1,447
1
14
16

5

This is important now that it's completely removed in 1.9 – jocull Jan 16 '13 at 16:38
1

this is the correct answer for almost everyone who's having this issue in 2013... – ProblemsOfSumit Jul 24 '13 at 13:09

score 9 · Accepted Answer · edited May 23 '17 at 12:25

9

.live() was introduced in jQuery 1.3, therefore it won't work with earlier versions.

.live() has also since been deprecated in jQuery 1.7 onwards.

The alternatives are .on() and .delegate()

See related question jQuery 1.9 .live() is not a function on how to migrate existing code.

edited May 23 '17 at 12:25

Community

1
1

answered Nov 03 '10 at 01:53

Scott Harwell

7,457
2
28
41

1

This simply isn't true, `.live( eventType, handler )` was added in 1.3, see [the docs](http://api.jquery.com/live/). Maybe he is using a version older than that though... – Evan Carroll Nov 03 '10 at 01:56
Well, somehow I was using 1.2 something. So it definitely wasn't supported. I typically point it directly to the internet, but it's definitely good to know when certain jquery methods are and are not supported because it was driving me crazy. – JohnMerlino Nov 03 '10 at 01:59
@Evan, I meant 1.3...my mistake. – Scott Harwell Nov 03 '10 at 02:06

score 1 · Answer 3 · edited Jun 10 '14 at 13:01

1

Tente usar .bind no lugar de .live

Try to use .bind instead of .live

edited Jun 10 '14 at 13:01

Samuel Liew

76,741
107
159
260

answered Feb 22 '13 at 19:56

João Marcos Santos Teixeira

495
4
8

score 1 · Answer 4 · edited May 23 '17 at 11:46

1

For anyone else who is using >= v1.9 please see here about depreciation: jQuery 1.9 .live() is not a function

edited May 23 '17 at 11:46

Community

1
1

answered Feb 26 '13 at 11:53

Marklar

21
3

score 0 · Answer 5 · answered Jul 01 '13 at 14:15

Find this funcion in wp-includes\js\thickbox\thickbox.js and change the function:

function tb_init(domChunk){
  jQuery(domChunk).live('click', tb_click);
}

Replacing the "live" method for "on", like this:

function tb_init(domChunk){
    jQuery(domChunk).on('click',tb_click);
}

If you are using Nivo-Slider, the jquery.nivo.slider.js will need similar changes.

$().live is not a function - JavaScript/jQuery

5 Answers5