0

Jquery モバイル パネルが機能しません。ドキュメントを読みましたが、なぜ機能しないのかわかりません。

<div data-role="page">

  <div data-role="header" data-position="fixed">
        <a href="#menu-panel" data-icon="grid" data-iconpos="notext">Menu</a> <h1>Home</h1>
    </div>

    <div data-role="content">
        <a href="#" data-role="button" data-icon="gear" data-iconpos="bottom" data-inline="true">Profilo</a>        
    </div>

    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>

    <div data-role="panel" id="menu-panel">
        <ul data-role="listview">
            <li><a href="index.html">Home</a></li>
            <li><a href="match.html">Match</a></li>
            <li><a href="profilo.html">Profilo</a></li>
            <li><a href="mercatino.html">Mercatino</a></li>
        </ul>
    </div><!-- /panel -->       
</div><!-- /page -->

この ID はJsFiddle ページです

私はjqueryモバイルを初めて使用しています..問題がばかげている場合は申し訳ありません^^ありがとう

4

2 に答える 2

2

JQueryMobile の間違ったバージョン (1.2.1) がロードされています。パネルのサポートは、JQM 1.3.0 から開始されています。私はあなたの jsFiddle をフォークし、jQuery と JQM を 1.3.2 に更新しました。

あなたと同じコードが機能します。

<div data-role="page">

    <div data-role="header" data-position="fixed">
        <a href="#menu-panel" data-icon="grid" data-iconpos="notext">Cancel</a> <h1>Home</h1>
    </div>

    <div data-role="content">
        <a href="#" data-role="button" data-icon="gear" data-iconpos="bottom" data-inline="true">Profilo</a>    
        <a href="#" data-role="button" data-icon="gear" data-iconpos="bottom" data-inline="true">Profilo</a>
        <a href="#" data-role="button" data-icon="gear" data-iconpos="bottom" data-inline="true">Profilo</a>
        <a href="#" data-role="button" data-icon="gear" data-iconpos="bottom" data-inline="true">Profilo</a>        
    </div>

    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>

    <div data-role="panel" id="menu-panel">
        <ul data-role="listview">
            <li><a href="index.html">Home</a></li>
            <li><a href="match.html">Match</a></li>
            <li><a href="profilo.html">Profilo</a></li>
            <li><a href="mercatino.html">Mercatino</a></li>
        </ul>
    </div><!-- /panel -->       
</div><!-- /page -->
于 2013-08-11T15:43:37.607 に答える
1

JQuery モバイル バージョンを更新する必要があります。ここで実行してください: http://jquerymobile.com/download/

于 2013-08-11T15:49:43.137 に答える