51

I was browsing through the jQuery api and noticed that the load method is on the deprecated list.

Categories: Deprecated | Events > Document Loading

I usually use this method to check if images are completly loaded. Why is it deprecated? And what am I supposed to be using instead?

Johan
  • 35,120
  • 54
  • 178
  • 293
  • Probably because it was being confused with `$(document).ready`, which executes earlier? – Blazemonger Sep 28 '12 at 15:45
  • There is a native onload function that works just fine, no need for jQuery to do this ? – adeneo Sep 28 '12 at 15:46
  • You are confusing the `load` [_method_](http://api.jquery.com/load/) with the `load` [_event_](http://api.jquery.com/load-event/). To check if images are loaded, you use the _event_. – Sparky Sep 28 '12 at 16:00
  • Typically, comments on the OP are meant for the OP. – Sparky Sep 28 '12 at 16:01
  • 4
    @Sparky, there is a `load()` *method* that registers a handler for the `load` *event* (a shortcut for `on("load")`). That method is indeed deprecated in favor of `on()` now. – Frédéric Hamidi Sep 28 '12 at 16:03
  • There is a `load` [event](http://api.jquery.com/load-event/) to check if something is loaded. And there is a `load` [method](http://api.jquery.com/load/) to load from an external source. These are two totally different things. I never addressed any issue of deprecation, only of the OP mixing terminology. – Sparky Sep 28 '12 at 16:05
  • @Sparky672 - yes there is, and the first one is the one that checks if an image has loaded, and it's also the one that is deprecated, so the OP is not confused, it seems you are ? – adeneo Sep 28 '12 at 16:07
  • @Sparky, respectfully disagree. Right now the method `$.fn.load()` is used both to register a `load` handler and to replace an element's content with the result of an AJAX request, depending on the arguments passed. This ambiguous situation led to the deprecation of the first incarnation. – Frédéric Hamidi Sep 28 '12 at 16:08
  • What are you people disagreeing with? The OP linked to the "event" while he labeled it a "method". I merely pointed out (with links to proper documentation) that the "load method" and the "load event" are two things. Read my comments again. – Sparky Sep 28 '12 at 16:10
  • @Sparky672 - You are indeed right. I assumed you pointed out an error in the question, when all you where doing was nitpicking on semantics :-) ... – adeneo Sep 28 '12 at 16:12
  • 1
    Yes, at SO, nitpicking technical semantics is what we do, or should be doing. – Sparky Sep 28 '12 at 16:13
  • 2
    @Sparky, okay, let's try this again. There is a `load` event that is exposed by the DOM layer. jQuery provide the `$.fn.load()` *method* to register a handler with that event. That method has another use (AJAX request). But that's a method, not an event (it can be called, and an event cannot be called, only triggered). The documentation page is named `load-event` to disambiguate between the two purposes of the method, but it still documents a *method*. – Frédéric Hamidi Sep 28 '12 at 16:15
  • 2
    Ah yes @FrédéricHamidi, I see that. No disagreement. I always remembered it by its description in the [docs](http://api.jquery.com/load-event/), _"Bind an **event** handler to the "load" JavaScript **event**."_. Thank-you for the detailed explanation. – Sparky Sep 28 '12 at 16:20

3 Answers3

73

See bug #11733, which documents this deprecation:

The .load() method is an ambiguous signature, it can either be an ajax load or attach/fire a "load" event. CCAO cannot tell them apart since it's a dynamic decision based on arguments.

To avoid ambiguities related to the method's signature, it is now recommended to use on() instead. For instance:

$("selector").load(function() {
    // ...
});

Should become:

$("selector").on("load", function() {
    // ...
});
Frédéric Hamidi
  • 258,201
  • 41
  • 486
  • 479
  • Not really, `on()` was always intended to be used like this. It supersedes `bind()` as well as `delegate()` and `live()`. I would say the distinction (in terms of registration methods) between bound and delegated events has disappeared since `on()` was introduced. – Frédéric Hamidi Sep 28 '12 at 21:39
  • I agree to use but what if I have URL to be loaded so my code is $methods.load(url, function () { //do smething }); where method is variale which has an html element so i want rewrite this with $methods.on('load', url, function(){//do something}); sadly its not working – VinK Sep 29 '20 at 04:21
  • its giving console error for Syntax error, unrecognized expression: to the URL – VinK Sep 29 '20 at 04:58
0

load function deprcated in jQuery alternative of it is on which you can use like 

$("iframe").on("load",function()
{
 
 alert("on loaded iframe");
 
});

this work perfect for jquery-3.1.1.

Mohsin Shoukat
  • 1,190
  • 1
  • 13
  • 22
-5

If load does not work as expected, an alternative is:

$(window).one("scroll", foo);

Or

$(window).one("scroll", function(){/*...*/});

Specifically, scroll event binding is useful in Android when DOMContentLoaded doesn't work as expected, and IE8 and below when onreadystatechange does not work as expected.

References

Paul Sweatte
  • 24,148
  • 7
  • 127
  • 265
  • Its not replacement or good workaround for load -_- , see : http://api.jquery.com/one/ – Al-Mothafar Jan 05 '14 at 14:25
  • @Al-Mothafar Scroll event binding works in at least some [platforms](http://webreflection.blogspot.com/2009/10/android-dom-finger-events.html), [scenarios](http://bugs.jquery.com/ticket/2614) and [browsers](http://javascript.info/tutorial/onload-ondomcontentloaded#ie-lt-9-hack-for-a-document-not-inside-a-frame). – Paul Sweatte Jan 07 '14 at 00:07
  • @Al-Mothafar Why would you expect onload to fire multiple times, making .one necessary? – NoBugs Feb 18 '16 at 07:54
  • @PaulSweatte That one linked article is old, second is no more, and the last one should not be relevant to jQuery's load event. It is true that iOS 8 doesn't fire load event at all in some rare cases though. http://stackoverflow.com/questions/31744477/ – NoBugs Feb 18 '16 at 07:57
  • The [jquery docs on load](http://api.jquery.com/load-event/) highlight it's failings now, "There are several known caveats with this that should be noted...." – Liam Apr 20 '16 at 15:44