jQuery Mobile $ (Dokument) .ready gleichwertig

in der ajax-navigation Seiten, die klassische "Dokument bereit" - form, die für die Durchführung der Initialisierung javascript einfach nicht ausgelöst.

Was ist der richtige Weg zu execute code in ajax geladenen Seite?

(Ich meine damit nicht meine ajax... es ist der jquery-mobile-Seite-navigation-system, das bringt mich zu dieser Seite)

Ok, ich habe den Verdacht, dass so etwas wie... vielen Dank =) Aber... es funktioniert immer noch nicht, hier mein code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>mypage</title>

    <link rel="stylesheet" href="jquery.mobile-1.0a4.min.css" />
    <script type="text/javascript" src="jquery-1.5.min.js"></script>
    <script type="text/javascript" src="jquery.mobile-1.0a4.min.js"></script>
    <script type="text/javascript">
        $('div').live('pageshow',function(event, ui){
          alert('ciao');
        });
    </script>

</head>

<body>

    <div data-role="page">

        <div data-role="header" data-position="fixed">
            <h1>Shopping Cart</h1>
        </div>

        <div data-role="content"> asd


        </div>

    </div>

</body>

Muss ich angeben, um die div-id?

InformationsquelleAutor der Frage Fabio B. | 2011-04-11

19

Verbrachte ich einige Zeit auf die Erforschung, die seit JQM-docs sind nicht sehr detailliert an dieser Stelle. Lösung unten funktioniert gut für mich:
```
<script type="text/javascript">
$('div:jqmData(role="page")').live('pagebeforeshow',function(){
    //code to execute on each page change
});
</script>
```
Implementieren Sie Ihre eigene überprüfung fließen, um zu verhindern, dass mehrere Initialisierung, da der code oben ausgeführt wird, die auf jeder Seite ändern

InformationsquelleAutor der Antwort Jura Khrapunov
14

Binden an die "pageinit" Ereignis. Von JQM-docs: http://api.jquerymobile.com/pageinit/

InformationsquelleAutor der Antwort Crashalot
12

Die besten Gegenwert von $(document).ready() ist $(document).bind('pageinit')

Werfen Sie einen Blick auf das jQuery-Mobile-Dokumentation : http://jquerymobile.com/demos/1.1.1/docs/api/events.html

Wichtig: Verwenden Sie $(document).bind('pageinit'), nicht $(document).ready()

Das erste, was Sie lernen in jQuery ist der Aufruf-code, der in der
$(document).ready () - Funktion, so wird alles ausgeführt, sobald die
DOM geladen ist. Doch, in jQuery Mobile, Ajax verwendet wird, laden Sie die
Inhalt jeder Seite in den DOM, wie Sie navigieren, und die DOM-ready
handler nur ausgeführt wird, für die erste Seite. Um code auszuführen, wenn ein
neue Seite wird geladen und erstellt haben, können Sie binden Sie an das pageinit-Ereignis.
Dieses Ereignis wird im detail erklärt, am Ende dieser Seite.

InformationsquelleAutor der Antwort Random78952
5

Wenn Sie möchten, dass der code zur Ausführung auf einer bestimmten Seite (ich Wette, das ist der Fall), können Sie sich dieses Muster:
```
$('div:jqmData(url="thepageyouwanted.html")').live('pageshow',function(){
    //code to execute on that page
    //$(this) works as expected - refers the page
});
```
Ereignisse, die Sie verwenden können:
- pagebeforeshow beginnt kurz vor dem übergang
- pageshow beginnt direkt nach übergang
- pagecreate startet nur das erste mal die Seite geladen ist
InformationsquelleAutor der Antwort naugtur
3

Alle pageshow und pagebefore show-Veranstaltungen sind jedes mal aufgerufen, angezeigt. Wenn Sie wollen etwas, das das erste mal passiert, können Sie etwas wie das hier tun:
```
  $('#pageelementid').live("pagecreate", pageInitializationHandler);
```
Dann später im code:
```
  function pageInitializationHandler(event) {
      //possibly optional based on what exactly you're doing,
      //but keep it in mind in case you need it.
      //Also, this seems to need to be an exact duplicate of the
      //way you used it with the .live() method or jQ/jQM won't unbind
      //the right thing
      $('#pageelementid').die("pagecreate", pageInitializationHandler);

      //Do your actual initialization stuff
  }
```
Fand ich dies besonders hilfreich, wenn man html-Dateien mit mehreren JQM "Seiten" in Ihnen. Ich meine so, dass der eigentliche code für die Initialisierung der ganze Kram ist in meinem Haupt-Seite (der Datei) und dann werden alle anderen Unterseiten haben eine pagecreate handler, der prüft, um zu sehen, ob der code für die Initialisierung ausgelöst hat und wenn nicht, hat ein $.mobile.changePage("#mainpage"). Funktioniert auch Recht gut.

InformationsquelleAutor der Antwort Joe Bedurndurn
1

Wie bereits erwähnt, der pageinit-Ereignis funktioniert. Allerdings, wenn Sie hatte die Falle einer multi-physikalischen Seite situation (zB: Navigation aus index.html zu mypage.html), die Funktion, die ausgeführt wird, ist auf die Muttergesellschaft.

Logik in der pageinit müsste etwas sein, was in Bezug auf die Eltern, nicht der link geladen wird. Sie konnte nicht rufen Sie eine Funktion auf der Seite, die Navigation, weil die navigation erfolgt über eine ajax-callback in JQM und Elemente auf Ihr Kind Seite wäre out of scope.

In diesem speziellen Fall, könnten Sie mit den data-ajax="false" Attribut:
```
<a href="mypage.html" data-ajax="false">My Page</a>
```
Dies zu tun, entfernen Sie die ajax-navigation, eine Seite komplett neu zu laden, was wiederum Feuer, ein $(document).ready-Funktion auf der Seite, die Sie laden.

InformationsquelleAutor der Antwort Justin Saraceno

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.