1

バックボーンとJQMを使用して、プロジェクト内にオーバーレイパネルを作成しようとしています。オーバーレイパネルは、JQMドキュメントで説明されている例のように機能する必要があります。

http://jquerymobile.com/demos/1.2.0/docs/pages/popup/popup-panels.html

バックボーンとJQMの最初のステップのチュートリアルに基づく私のプロジェクトでは、バックボーンルーティングを使用しています。changePage（）への通常のルートはうまく機能しています。オーバーレイパネルを機能させることができません。

プロジェクト用にgitリポジトリを作成しました。ヘッダーの[メニュー]ボタンをクリックすると、上のデモのようにオーバーレイパネルがスライドします。

https://github.com/Devthias/BackboneJQM.git

ルーター内で、changePage関数を呼び出す前にdata-role属性をポップアップに設定しようとしました。

var AppRouter = Backbone.Router.extend({

routes:{
    "":"home",
    "settings":"settings",
    "menuPanel":"menuPanel"
},

initialize:function () {
    // Handle back button throughout the application
    $('.back').live('click', function(event) {
        window.history.back();
        return false;
    });
    this.firstPage = true;
},

....

menuPanel:function(){
    console.log('#menuPanel');
    this.openPopup(new MenuPanelView());
},

changePage:function (page) {
    $(page.el).attr('data-role', 'page');
    page.render();
    $('body').append($(page.el));
    var transition = $.mobile.defaultPageTransition;
    $.mobile.changePage($(page.el), {changeHash:false, transition: transition});
},

openPopup:function (page){
    $(page.el).attr('data-role', 'popup');
    page.render();
    $('body').append($(page.el));
    var transition = $.mobile.defaultPageTransition;
    $.mobile.changePage($(page.el), {});
}

}）;

誰かが私が間違っていることを知っていて、私を助けることができますか？

どうもありがとうございます！

4

1 に答える 1

0

ページの変更は間違いなく間違った動きです..

私にとっては、テンプレートにプレースホルダーを配置するとすぐに機能し始めました。

<div data-role="page">    
  <div data-role="content">

    ...

    <div data-role="popup" id="myPopup" data-history="false">
      <span>&nbsp;<span>
    </div>
  </div>
</div>

そして、ルーターを次のようにしました：

openPopup:function (page){
    $('#myPopup').html($(page.el)).popup('open');
}
于 2013-03-21T18:36:18.973 に答える