Upgrade from jQuery 1.x to jQuery 2.x

Question

I am trying to upgrade from jQuery 1.x to jQuery 2.x.

I have jQuery 1.8 and jQueryUI 1.8, and now I want to upgrade to jQuery 2.x and enhance my web app.

So my question is what to change and remove, like for Ajax and events.

Like these errors I am talking about

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

Did functions like .on() and .ajax() change any? (I know .live was deprecated).

P.S. I have to add Zurb Foundation 5 which uses jQuery 2.

you shouldn't have to change anything going from 1.8 to 2.x, other than dropping support for oldie. — Kevin B, Apr 17 '14 at 17:17
jQuery 1.x (1.9+) and 2.x have the same API. The only difference is that 2.x does not support IE 6-8. Please see: http://jquery.com/upgrade-guide/1.9/ — gen_Eric, Apr 17 '14 at 17:22
@KevinB i researched beafore asking, http://jquery.com/download/ and other places also download some bunch libraries, that's my bad asking here — ucefkh, Apr 17 '14 at 17:22
that's what i downloaded http://github.com/jquery/jquery-migrate — ucefkh, Apr 17 '14 at 17:23
the point is either you didn't even try to do the upgrade, or you had a problem and you haven't provided us with that problem. either way, we can't really answer that. the answer is simply "you shouldn't have any problems" — Kevin B, Apr 17 '14 at 17:23
@KevinB before i asked i added the 1.9 and 2.X am asking if will i have any probleme with my ajax library which used jquery 1.8 — ucefkh, Apr 17 '14 at 17:25
No. you will not. jquery's ajax methods haven't changed significantly since jquery 1.5 — Kevin B, Apr 17 '14 at 17:25
ok that's a not bad answer No but i want proves, cause when i added J2 i did have like dialog not found(i know it's in jquery ui :p ) and other stuff — ucefkh, Apr 17 '14 at 17:26
Then ask another question with that information instead. simply asking if there are any problems with upgrading is way too broad. Something that could cause problems for you may not affect me, for example. — Kevin B, Apr 17 '14 at 17:27
I did want just to make it simple for other to know the how to steps and if yes or no they should fear upgrading to j2 and also know if i would have to change any code, like when i moved from 1.X to the another 1.X and did have to change .live to .on( — ucefkh, Apr 17 '14 at 17:30

score 73 · Answer 1 · edited Aug 28 '17 at 22:10

Do not use offset option in position properties, e.g. code $element.position({my: 'center center', at: 'center center', offset: '5 -10'}) should be replaced with $element.position({my: 'center center', at: 'center+5 center-10'}).
Do not use $element.bind(), $element.live(), $element.delegate() to assign event handler, use $element.on().
Do not use browser sniffing with $.browser, try to use feature detection instead ($.support).
Do not use deferred.isRejected(), deferred.isResolved(), use deferred.state() instead. Do not use deferred.pipe(), the deferred.then() method should be used instead.
Do not use the $elements.size() method, use the $elements.length property instead. The .size() method is functionally equivalent to the .length property; however, the .length property is preferred because it does not have the overhead of a function call.
Checkbox/radio state in a .trigger()ed "click" event now has the same state as in a user-initiated action.
Changed naming convention for .data() keys, e.g., ui-dialog instead of dialog. (http://jqueryui.com/upgrade-guide/1.9/#changed-naming-convention-for-data-keys).
Do not use $.ui.contains(), use $.contains() instead.
Each widget instance already has unique identifier this.uuid and event namespace this.eventNamespace = "." + this.widgetName + this.uuid. Do not generate similar things manually.
Do not use $element.focus(n) - it is deprecated. Use setTimeout(function() { $element.focus(); }, n);.
Do not use $element.zIndex() - it is deprecated.
Do not use $.ui.keyCode.NUMPAD_* constants - they are removed.
Do not use $element.data('someWidget') to retrieve widget instance. Use instance() method: $element.someWidget('instance'). Unlike other plugin methods, the instance() method is safe to call on any element. If the element is not an instance of the given widget, the method returns undefined: $('<div></div>').dialog('instance') /* returns undefined instead of throwing Error */.

Original upgrade guides and full list of changes:

14. Check which jQuery version your other downloaded JS libraries require. — Jaran, Nov 18 '15 at 11:30

score 36 · Accepted Answer · edited Jun 01 '15 at 18:24

36

If you are thinking of upgrading to jQuery 1.x to jQuery 2.x should consider this and take these steps :) :

1.No More Support for IE6/7/8

I still think it’s a little premature to abandon IE8 but the team couldn’t wait any longer. jQuery 2.0 removes all the legacy IE code for node selection, DOM manipulation, event handling and Ajax.

2.Custom build feature has been refined in version 2.0

so you can exclude any of 12 unused modules and shrink jQuery below 10Kb. The modules which can be omitted are: List of Functions

Should I Upgrade?

It’s important to understand that jQuery 2.0 has API parity with jQuery 1.9. There are a small number of bug fixes but no new features.

However, if you’re one of those lucky developers who has dropped support for IE6/7/8, grab jQuery 2.0 and don’t look back.

edited Jun 01 '15 at 18:24

Jonathan Hall

75,165
16
143
189

answered Apr 17 '14 at 17:39

ucefkh

2,509
2
22
18

2

Just to note, as of January 2015, IE 8 is still 19% of market share, according to https://www.netmarketshare.com/browser-market-share.aspx?qprid=2&qpcustomd=0 – Brian Burns Feb 19 '15 at 17:35
2

Yes but you can add IE fix (check if the client is using IE then load the library that will fix that ) sounds good ? – ucefkh Feb 24 '15 at 02:41
@bburns.km netmarketshare.com is the only one of [these many sites](http://www.impressivewebs.com/browser-usage-stats/) reporting such high IE numbers. Gmail doesn't support IE8 anymore (only with their basic HTML version). I think it's safe to ditch it. – poshest May 18 '15 at 10:53
Just to mention at moment of this comment that Microsoft has ended the support for Internet Explorer 7/8/9/10 on Jan 12, 2016. Hope to force users to migrate to IE11 (win7) and Edge (win10). https://www.microsoft.com/en-ca/WindowsForBusiness/End-of-IE-support . You can also see the browsers stats from W3C http://www.w3schools.com/browsers/browsers_stats.asp – Maximus Decimus Jan 27 '16 at 15:28
Looks like IE8 is now less than 5% of market share according to the same chart quoted above. On my own site it's less than 1% of the 5% of IE users... virtually nothing – PandaWood Aug 19 '16 at 23:02

Kevin B · Answer 3 · 2014-04-17T17:37:32.030

In jQuery 1.9, several methods were removed that were available in prior versions of jquery.

If you are using those methods, then yes, you will run into problems.

Otherwise, no you will not run into problems.

Using the jQuery migrate plugin that you mentioned will solve all of the problems that you could possibly have with upgrading from 1.8 to 1.9+(which includes 2.x) and it will also inform you of any methods you are using that have been removed when you look at the console. The migrate plugin is the best way of upgrading jquery from 1.6x-1.8x to 1.9+/2.0+. Include jquery 2.x, then include the migrate plugin, then open your console and replace old methods until the migrate plugin stops giving your warnings. At that point you should be able to safely remove the migrate plugin.

Thanks Kevin don't underestimate anyone, as i don't even ask here because of this people downvoting, anyway thanks :) — ucefkh, Apr 17 '14 at 17:33

Upgrade from jQuery 1.x to jQuery 2.x

3 Answers3

Linked