打开操作之前的 Jquery 移动面板

Question

我试图在面板打开之前做一些事情，但我没有运气...... 实际上我想用ajax加载一个文件在里面，但不幸的是即使警报也不起作用

<script type="text/javascript">
  $( "#nav-panelz" ).panel({
    beforeopen: function( event, ui ) { }
  });


$( "#nav-panelz" ).on( "panelbeforeopen", function( event, ui ) {
  alert('Before Open');
});

</script>

body 内部

<div data-role="panel" data-display="push" data-theme="b" id="nav-panelz" style="z-index:250000;">

  <ul data-role="listview">
    <li data-icon="delete"><a href="#" data-rel="close" style="color:#09F;">Close menu</a></li>
<li><a href="#panel-responsive-page2">Accordion</a></li>
    <li><a href="#panel-responsive-page2">Ajax Navigation</a></li>
    <li><a href="#panel-responsive-page2">Autocomplete</a></li>
    <li><a href="#panel-responsive-page2">Buttons</a></li>
  </ul>
</div>

有什么建议吗？

Answer 1

尝试将代码放入 jQuery Mobile 页面事件中，例如 createpage:

$(document).on("pagecreate", "#page1", function () {
    $( "#menuA" ).on( "panelbeforeopen", function( event, ui ) {
        alert('Before Open');
        $("#pnlContent").html('<p>Dynamically added content</p>');
    });
});

Here is a DEMO

按照您现在的方式，当您尝试附加到事件时，面板可能尚未增强/初始化。