Question

我认为问题标题是自我解释的，我只是设置了一个脚本来处理我的页面上的右侧滑动，它应该打开我的左侧面板，但我真的不知道为什么不工作..

头像：

<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="JQuery/JQuery/jquery-1.10.2.min.js"></script>
<script src="JQuery/JQueryMobile/jquery.mobile-1.4.0.js"></script>
<link rel="stylesheet" href="JQuery/JQueryMobile/jquery.mobile-1.4.0.css" />

<script>
    $( document ).on( "pageinit", "#homepage", function() {
        $( document ).on( "swiperight", "#homepage", function( e ) {
            if ( $.mobile.activePage.jqmData( "panel" ) !== "open" ) {
                if ( e.type === "swiperight" ) {
                    $( "#mypanel" ).panel( "open" );
                }
            }
        });
    });
</script>

页面：

<body>

    <div data-role="page" id="homepage" data-url="homepage">    

        <div data-role="panel" id="mypanel" data-position="left" data-display="push">
            <!-- panel content goes here -->
        </div><!-- /panel -->

        <div data-role="header">
            <a href="#mypanel" data-icon="grid">Menu</a>
            <h1>Projecto Colibri</h1>
        </div><!-- /header -->

        <div role="main" class="ui-content">
            <p>Page content goes here.</p>
        </div><!-- /content -->

        <div data-role="footer" data-theme="b" data-position="fixed">
            <nav data-role="navbar">
                <ul>
                    <li><a href="#" data-icon="shop">Artigos</a></li>
                    <li><a href="#" data-icon="user">Clientes</a></li>
                    <li><a href="#" data-icon="gear">Fornecedores</a></li>
                </ul>
            </nav>
        </div><!-- /footer -->

    </div>
</body>

JQuery Mobile swiperight没有打开面板

0 个答案: