jQueryMobile "data-scroll=true' funktioniert nicht auf dynamisch injiziert Seiten

data-scroll="true" funktioniert gut, wenn die Seite statische Seite, aber wenn ich auf add-Seite dynamisch mit javascript funktioniert es nicht.

Meine Header-Abschnitt :

<link rel="stylesheet" href="css/jquery.mobile-1.0rc2.css" />
<link rel="stylesheet" href="css/jquery.mobile.scrollview.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.0rc2.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.mobile.scrollview.js"></script>
<script type="text/javascript" src="js/scrollview.js"></script>

Habe ich auch noch die data-scroll Attribut aus und legen Sie es auf true mit javascript, unten ist mein code :

var pageHtml = "<div data-role='page' data-scroll='true' id=page" + pageId + " data-url=page" + pageId + ">";
var pageHeader = "<div data-role='header' data-position='fixed'><h1>" + menuItem + "</h1></div>";
var pageContent = "<div data-role='content' id='page" + pageId + "Content'></div>";
var page = pageHtml + pageHeader + pageContent + "</div>";
$(page).appendTo($.mobile.pageContainer);

Bitte helfen Sie mir...

Zu schauen, was Sie geschrieben haben jQM noch keine Unterstützung für jQuery 1.7.x sollte mit 1.6.4, sollten Sie ein upgrade auf jQM 1.0 auch die Anbindung an eine demo (wie jsfiddle.net) wäre hilfreich, genauso wie alle Fehler, die Sie auftreten

InformationsquelleAutor Tushar Ahirrao | 2011-12-02

  1. 1

    Probieren Sie etwas wie dieses:

    $('yourScrollersId').scrollview();

    Ich hatte das gleiche problem, bei mir funktioniert.

    Besser später als nie 🙂

    NÖ. funktioniert nicht
    Nicht für mich arbeiten, entweder :S

    InformationsquelleAutor Dennis

  2. 1

    Nach einer langen Forschung, was ich gefunden habe ist-

    wir müssen die Last der dynamic HTML, die für jede scroll-block, um eindeutige container s.

    zB.-

    HTML

    <div data-role="content" id="container">

    <div id="scrollContainer"></div>

    <div id="anotherContainer"></div>

</div>

    JS

    wenn wir geladen haben, scrollview auf 'scrollContainer' auf den ersten, 

    $('#scrollContainer').html(loadHtml);
$("#scrollContainer").scrollview();
$("#scrollContainer").trigger('create');

    dann das nächste mal, wir müssen die Last in einem anderen container-

    $('#anotherContainer').html(loadHtml);
$("#anotherContainer").scrollview();
$("#anotherContainer").trigger('create');

    Optional

    Wieder dynamisch laden in #scrollContainer wir können entfernen & erstellen Sie die <div>.
    nach Ausführung der zweiten code-block

    $('#scrollContainer').remove();
$('#container').append('<div id="scrollContainer"></div>');
//$('#scrollContainer').empty();  //simply making this DIV empty WILL NOT WORK, we need to REMOVE DYNAMIC CLASSES, STYLES also. So, its better to recreate the LOADCONTAINER

    andere Lösungen da sein sollte, aber dieses funktioniert wirklich.

    InformationsquelleAutor Avi C

  3. 0

    Müssen Sie JQM anzuwenden, dass-Seite - versuchen, 

    $(page).appendTo($.mobile.pageContainer).page();

    oder sogar

    $(page).appendTo($.mobile.pageContainer).trigger('create');

    Hoffe, das hilft

    UPDATE: hier ist der JQM Dokumentation, wie offiziell dies

    dies aber immer noch nicht funktioniert...

    InformationsquelleAutor Leon

Schreibe einen Kommentar