javascript - jquerymobilepageshowイベントが最初のページで発生していません

Question

私はjqueryモバイルフレームワークに不慣れです。私の観察では、ドキュメントの最初のページでpagebeforeshowイベントを発生させることができません。

誰かが同じ問題に直面した可能性があります。イベントまたは他の代替手段をトリガーする手順を教えてください

Answer 1

デモ http://jsfiddle.net/yNzzG/

pagebeforeshowデモでは、ハンドラーがトリガーされるとアラートが表示されます。

残りのコードはそれを明確にします、それが役立つことを願っています、

コード

$(document).bind('mobileinit', function() {
    alert('mobileinit');
});

$(function() {
    var selector = ':jqmData(role=page)';
    $('body').on('pageinit', selector, function(e, data) {
        // initialize page
        var $page = $(this);
        alert('init ' + $page.attr('id'));
    }).on('pagebeforeshow', selector, function(e, data) {
        // showpage
        var $page = $(this);
        alert('show Page before Show Stuff == > ' + $page.attr('id'));
    });
    $('#page1').on('pageinit', function(e, data) {
        // setup handler
        var $page = $(this);
        $page.find('.colorchanger').click(function() {
            var $content = $page.find('.ui-content'),
                isBodyC = $content.hasClass('ui-body-c');
            $content.toggleClass('ui-body-c', !isBodyC).toggleClass('ui-body-e', isBodyC);
        });

    });
});

Answer 2

私にとってうまく機能し、他のイベントハンドラーを必要としないため、すべてのページショーバインドが1つの場所にある別の方法は、ダミーの最初のページを作成して、すぐに最初に表示されるページに変更することです。

<div id="start" data-role="page" data-title="App Title"></div>
<div id="realFirstPage" data-role="page">
   ...
</div>

次に、document.ready関数の最後で、次のようにします。

setTimeout(function() {
    $.mobile.changePage($("#realFirstPage"), {
        transition: 'pop',
        changeHash: false
    });
}, 100);

Answer 3

これは、jquery domモデルが最初のページのページ表示イベントを発生させる準備ができていないために発生する可能性があります。したがって、pageinitイベントに（bind pageshow event）を含めてみてください。

$(document).on("pageinit", "#pageId", function(e){
    console.log( ' Inside the  pageinit event' );
    $(document).on("pageshow", "#pageId", function(e){
         // code for page show event
  });
         // code for pageinit event
  });