CODEWITHSUNDEEP
jqueryjquery-mobile
Hookstark
Hookstark

Reputation: 1159

"$(document).on('pageshow'" not working with jQuery 1.9.1 + JQM 1.3.0-stable

Working with jQuery 1.8.3

<!DOCTYPE html>
<html>
    <head>
        <script src="js/jquery-1.8.3.min.js"></script>
        <script src="js/jquery.mobile-1.3.0.min.js"></script>
        <script>
      $.support.cors = true;
      $.mobile.allowCrossDomainPages = true;

      $("#home").live("pageshow", function( event ) {
        alert( "Ok. This is Home!" );
      });
        </script>
    </head>
    <body>

    <!--- HOME --->
    <div data-role="page" id="home">
    <h2>Hello World</h2>
    </div>
    </body>
</html>

Alert works ok.

However, with jQuery 1.9.1 (please note that I changed the version and "live" with "on".

<!DOCTYPE html>
<html>
    <head>
        <script src="js/jquery-1.9.1.min.js"></script>
        <script src="js/jquery.mobile-1.3.0.min.js"></script>
        <script>
      $.support.cors = true;
      $.mobile.allowCrossDomainPages = true;

      $("#home").on("pageshow", function( event ) {
        alert( "Ok. This is Home!" );
      });
        </script>
    </head>
    <body>

    <!--- HOME --->
    <div data-role="page" id="home">
    <h2>Hello World</h2>
    </div>
    </body>
</html>

Alert won't work. I'm sure I'm doing something wrong. I've been reading that jQuery Mobile 1.3.0-stable would use jQuery 1.9.1, but perhaps I'm wrong.

Upvotes: 6

Views: 14237

Answers (1)

Denys S&#233;guret
Denys S&#233;guret

Reputation: 382150

Change

 $("#home").on("pageshow", function( event ) {

to

  $(document).on("pageshow", "#home", function( event ) {

The syntax of on isn't the same than the one of live : the element that will receive and delegate the event must be existing when you make the binding.

Upvotes: 12

Related Questions