Introduction:

In this article we will explain how to use Load() method in jquery or  how to attach Load event to a html element such as (image, script, frame, iframe) or how to execute a function when image completely loaded.

Description:

jQuery load () method is used to load a specific element. It attaches an event handler to load event. The load event occurs when a specific element is loaded. It is generally used with a URL (image, script, frame, iframe), and the window object.

Note: On some browsers, the load event did not trigger if the image is cached.

syntax:

$(selector).load(function)

jQuery Load() example

In this example code when the image will be loaded completely then user will be alerted with "Image loaded". In case any problem occurs while loading the image then no alert will be shown to the user. If we want to get notification if image couldn't get loaded, we can use .error() method.

 

 <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Jquery Tutorials</title>
    <script src="Scripts/jquery-1.8.2.min.js"></script>
    <script>       
            $(document).ready(function () {
                $("img").load(function () {
                    alert("Image loaded.");
                });
            });
    </script>  
</head>
<body>
    <img src="download.jpg" />
    
    <p><b>Note:</b> On some browsers, the load event did not trigger if the image is cached.</p>          
</body>
</html>

 

 

Output:


I hope it will help to you after reading it.

0 comments


Leave a comment

Make sure you enter the (*) required information where indicated. HTML code is not allowed.

Welcome to SQL Tutorials Point

Don't have an account? Click here to Create a new account, it takes less than a minute.