Jquery's Live() Is Deprecated. What Do I Use Now

jquery's live() is deprecated. What do I use now?

Of course:

http://api.jquery.com/on/

http://api.jquery.com/off/

The page for live() shows how to convert to on():

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

jQuery 1.9 .live() is not a function

jQuery .live() has been removed in version 1.9 onwards

That means if you are upgrading from version 1.8 and earlier, you will notice things breaking if you do not follow the migration guide below. You must not simply replace .live() with .on()!

---

Read before you start doing a search and replace:

For quick/hot fixes on a live site, do not just replace the function live with on,
as the parameters are different!

.live(events, function)

should map to:

.on(eventType, selector, function)

The (child) selector is very important! If you do not need to use this for any reason, set it to null.

---

Migration Example 1:

before:

$('#mainmenu a').live('click', function)

after, you move the child element (a) to the .on() selector:

$('#mainmenu').on('click', 'a', function)

---

Migration Example 2:

before:

$('.myButton').live('click', function)

after, you move the element .myButton to the .on() selector, and find the nearest parent element (preferably with an ID):

$('#parentElement').on('click', '.myButton', function)

If you do not know what to put as the parent, document always works:

$(document).on('click', '.myButton', function)

---

See also:

• jQuery - how to use the “on()” method instead of “live()”?
• jQuery 1.9 Migration Guide

jQuery .on function for future elements, as .live is deprecated

jQuery's documentation shows you would replace

$(selector).live(event, handler) 

with

$(document).on(event, selector, handler)

Also you have the option to be more precise and replace $(document) with a selector for a static parent of the element. For example, if you have a static table element and tr elements are added dynamically to the DOM, you could do something like $('table#id').on('click', 'tr', ...)

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

Replacing deprecated .live with .on

The problem is that .box element is created after the dom is ready, so the element doesn't exist for it to attach an event to.

You need to add the event handler to an element that already exists.

http://jsfiddle.net/DBfKz/72/

I changed your event to look like:

$("#container").on("click", '.box a', function(e) {
    $(e.target).parent().remove();
    updateLinkAndCounter();
});

Also changed your version of jQuery from 1.4.4 to 1.8.3

It works the same way now.

How to replace live from jQuery 1.8.3 to jQuery 1.9?

The docs already provide an example:

Rewriting the .live() method in terms of its successors is
straightforward; these are templates for equivalent calls for all
three event attachment methods:

$(selector).live(events, data, handler); // jQuery 1.3+
$(document).delegate(selector, events, data, handler); // jQuery 1.4.3+
$(document).on(events, selector, data, handler); // jQuery 1.7+

So: $(document).on("click", ".closed", function() { ... }).

jQuery - how to use the on() method instead of live()?

$('body').on('click', '#element', function(){
    $("#my").html(result);
});

The clicked element selector is now passed through the .on() function parameters, and the previous selector should be replaced with the closest parent selector preferably with an ID. If you do not know what parent selector to use, body works too, but is less efficient.

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

jQuery: how to replace .live with .on?

You should add event to any parent element of li.bibeintrag.

$('ul').on('click', "li.bibeintrag", function(){
    alert('myattribute =' + $(this).attr('myattribute'));
});

Jquery live function suddenly not working anymore

I assume you've updated to the latest version of jQuery? live() has been deprecated since jQ1.7, and is now removed as of 1.9.

Instead, you should use on() with a delegate parameter:

$(document).on('keydown', '.TextBox1', function(e) {
    var keyCode = e.keyCode || e.which;

    if (keyCode == 40) {
        e.preventDefault();
        //...
    }
});

Note that for best performance you should replace document in the above example with the closest parent element of .TextBox1 which is not dynamically appended to the DOM after page load.

What's wrong with the jQuery live method?

See some of the explanations here:

http://www.ultimatewebtips.com/why-jquery-live-is-a-bad-option-to-use/ (Site appears to be down)

Quote:

1. You can’t use .live() for reusable widgets.

2. .stopPropagation() doesn’t work with live.

3. .live() is slower.

4. .live() is not chainable.

Further beauty of .on() is that it streamlines all events quite well: http://api.jquery.com/on/

D'uh you know about the api link and see how .on() works :)

Quote:

The .on() method attaches event handlers to the currently selected set
of elements in the jQuery object. As of jQuery 1.7, the .on() method
provides all functionality required for attaching event handlers. For
help in converting from older jQuery event methods, see .bind(),
.delegate(), and .live(). To remove events bound with .on(), see
.off(). To attach an event that runs only once and then removes
itself, see .one()

---

Related Topics