6

パネルが開いているか閉じているかを確認しようとしています。

私はこのように試しました：

$(document).on('open', '.ui-panel', function(){
   console.log('open');     
})

しかし、何も起こりません。

jQ モバイル パネルのイベント リスナーを設定するにはどうすればよいですか?

開くことは問題ではありません。なぜなら、.panel('open')ボタン クリックに追加してから を追加するだけだからconsole.log()です。外側をクリックするとパネルが閉じますが、その瞬間を捉えるにはどうすればよいですか?

4

8 に答える 8

11

必要なのは、パネルが開いているか閉じているかを確認することですhasClass

if( $(".ui-panel").hasClass("ui-panel-open") == true ){
   alert("OPENED");
}else{
   alert("CLOSED");
}
于 2014-03-14T22:10:47.470 に答える
9

さて、私はこれを見つけました：

http://api.jquerymobile.com/panel/#event-beforeclose

だから私が必要だったのは：

$( ".selector" ).on( "panelbeforeclose", function( event, ui ) {} );
于 2013-03-14T16:52:36.873 に答える
4 
$(document).bind('panelopen', function (e, data) {
        $('body').css("overflow", "hidden");
    });

    $(document).bind('panelclose', function (e, data) {
        $('body').css("overflow", "auto");
    });

それが役に立てば幸い。

于 2013-07-03T18:36:22.257 に答える
1 
 function OpenPanel(panel) {
    if ( $( ".ui-page-active" ).jqmData( "panel" ) !== "open" ) {
        $(panel).panel("open");

    }else{
        $(panel).panel("close");
     }
}

使用法：

<div onclick='OpenPanel("#ui-panel1");'>Click Here</div>
于 2014-09-26T03:20:30.950 に答える
1

私はこのように使用します：

if ($("#id").find("div").css("visibility") == "hidden") {
    alert("Closed");
} else {
    alert("Opened");
}
于 2013-05-13T00:20:25.517 に答える
0

pagebeforehideまたはpagehideイベントが必要な場合があると思います。

jquerymobileのイベント情報については、こちらをご覧ください。

于 2013-01-22T21:52:36.483 に答える
0

パネルに適用される CSS JQM は、その状態を明示的に示します。これは非常に単純なバニラ JS ソリューションです。

1 var document.getElementById("name-of-panel") = my_panel;
2 my_panel.classList.contains("ui-panel-open");

2 行目は、開いている場合は「true」を返し、開いていない場合は「false」を返します。また、次の開発者 (または数か月後の自分自身) が、あなたが何をしていたかを理解するのがずっと簡単になります。

于 2014-02-02T23:55:42.720 に答える