Open In App

jQuery Mobile pageshow event

Last Updated : 30 Dec, 2020
Improve
Improve
Like Article
Like
Save
Share
Report

jQuery Mobile pageshow event is triggered on the “toPage” after the transition animation has completed. We can use this event for different purposes.

Syntax:

jQuery( ".selector" ).on( "pageshow", function( event ) {  } )

Approach:

  • First, add jQuery Mobile scripts needed for your project.
    <link rel="stylesheet"
        href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script 
        src="http://code.jquery.com/jquery-1.11.1.min.js">
    </script>
    <script 
        src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js">
    </script>

Example 1:

HTML




<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet"
              href=
        <script src=
      </script>
        <script src=
      </script>
  
        <script type="text/javascript">
            $(document).on("pageshow", function (event) {
                console.log(event);
            });
        </script>
    </head>
  
    <body>
        <center>
            <h1>GeeksforGeeks</h1>
            <h4>pageshow Event using jQuery Mobile</h4>
        </center>
    </body>
</html>


Output:

Example 2:

HTML




<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet"
              href=
        <script src=
      </script>
        <script src=
      </script>
  
        <script type="text/javascript">
            $(document).on("pageshow", function () {
                console.log("pageshow event fired");
            });
        </script>
    </head>
  
    <body>
        <center>
            <h1>GeeksforGeeks</h1>
            <h4>pageshow Event using jQuery Mobile</h4>
        </center>
    </body>
</html>


Output:



Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments

Similar Reads