What is the Replacement for jQuery.live

Question

What should be the proper replacement for the jQuery.live(). I know jQuery.on() does the same thing but in case of jQuery.on() we have to specify the parent in order to make it work.

Suppose i have 500 live on my page and now i want to change all the 500 live to on and doing it by selecting the parent of each element would not be feasible and would take more time.

Suppose i have $(".item").live("click",function(){ alert("test"); });

and if i replace it by jQuery.on() then it should be $("body").on("click",".item",function(){ alert("test"); });

but i wonder if there is some shortcut way or anything else to achieve this like this

$(".item").on("click",function(){ alert("test"); });

so that i can replace all in few seconds.

A fast and dirty solution would be a 3 lines plugin to keep a `live` function based on `on`. — Denys Séguret, Mar 11 '13 at 07:23
Isn't there something so that i don't have to use any plugins? — Nirmal Ram, Mar 11 '13 at 07:25
What's your editor ? Using a regex for the replacement is probably doable. — Denys Séguret, Mar 11 '13 at 07:25
@Joonas This wouldn't do the same as the live function. That's why a more complex replacement is needed. — Denys Séguret, Mar 11 '13 at 07:28
i am using komodo..and i know i can do regular expression search replace.but isn't there any other way to do it ? — Nirmal Ram, Mar 11 '13 at 07:28
@dystroy I figured that `$(".item").live("click", function() {});` and `$(".item").on("click", function() {});` would do the exact same thing, they wouldn't? — Joonas, Mar 11 '13 at 07:30
Like they say in the documents: `As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live().` — Ron van der Heijden, Mar 11 '13 at 07:32
@Joonas no, that won't give the "live" functionality i believe. you need to use the longer version OP posted — kennypu, Mar 11 '13 at 07:32
The biggest question is whether you really needed `.live()` in the first place. It's certainly unusual to see so many in one script. — Beetroot-Beetroot, Mar 11 '13 at 07:32
@Joonas no that won't do that. $(".item").on("click", function() {}); would work like $(".item").click(function() {}); — Nirmal Ram, Mar 11 '13 at 07:32
@ Beetroot-Beetroot : Yes i need that. I had created an app in jquery with using live and now when i am upgrading it to jQuery 1.9.1 i am having problems. — Nirmal Ram, Mar 11 '13 at 07:34
Right, right.. of course ( Removed my comment cause it was up voted and it didn't deserve that ). — Joonas, Mar 11 '13 at 07:41

score 5 · Accepted Answer · edited May 23 '17 at 11:59

.live() is dead, long live .live(): https://github.com/jquery/jquery/commit/eed78cc321ed7e2b37fb34e32fbb528b24f61d6e

Though seriously, for the one-liner you seek, you can just add it back:

jQuery.fn.live = function( types, data, fn ) { jQuery( this.context ).on( types, this.selector, data, fn ); return this; }

Add that towards the top of your JS to effectively create a shim that will allow you to use .live() as you want and not care about which version of jQuery you're using.

But really, like others are saying, you should just do a find-replaceall using the text editor of your choice, or a command line utility like sed. In the shim solution I give you, you're calling a function to call another function, which introduces a lot of overhead and may use an unnecessary amount of resources. .on() is much more efficient, especially if you call it directly.

Update: The above solution relies on jQuery's internal .context property, which has been deprecated since jQuery 1.10 and may disappear in any subsequent version. An alternative version that should fulfill your needs most of the time would be to simply replace this.context with document. This has limitations outlined in the .context property's API:

The value of this property is typically equal to document, as this is the default context for jQuery objects if none is supplied. The context may differ if, for example, the object was created by searching within an <iframe> or XML document.

So it may fail. Anyway, by now you definitely have no excuse to not be using .on() directly. Feel free to check out my tips on upgrading to the most recent version of jQuery.

score 3 · Answer 2 · answered Mar 11 '13 at 07:40

You could define a small plugin giving you the old live function by calling on but this would only let you with a worse code. You need to refactor your code to use on properly.

A solution to help you manage the initial change a little more easily would be to use a regex to do the replacement. Most text editors can let you do that.

For the use case you give, you could use this (example in JavaScript, adapt for your editor) :

var output = input.replace(
      /\$\(\"([^\"]+)\"\)\.live\(\"([^\"]+)\"/g,
      '$(document.body).on("$2", "$1"'
);

Input :

$(".item").live("click",function(){ alert("test"); });
$(".item2").live("change",function(){ console.log("test"); });

Output :

$(document.body).on("click", ".item",function(){ alert("test"); });
$(document.body).on("change", ".item2",function(){ window.top.console.log("test"); });

After this initial transformation you would have to look for better parent elements than document.body.

For this i have to do it for each and every element. I am searching a simple one line solution. — Nirmal Ram, Mar 11 '13 at 07:45
No : your editor can apply a regex to a whole file, just like my small js code can be applied to a whole file. — Denys Séguret, Mar 11 '13 at 07:46

score 2 · Answer 3 · answered Mar 11 '13 at 08:17

Similar to @destroy's answer - something else to try - after backing up your file

I don't have Komodo but managed to develop the following for Notepad++ :

Find

\$\("(.+)"\).live\("(.+)",

Replace with

$(document).on('\2', '\1',

Regex syntaxes vary so you may have to work at it.

You may also need to adapt or run several variants of the regex, for example to cater for single versus double quotes, or whitespace.

What is the Replacement for jQuery.live

3 Answers3