2

わかりました。私はjqueryに少し錆びていて、jquery mobileを初めて使用するので、気楽に行ってください;）。わかりました。jquerymobileを使用してモバイルウェブサイトを作成しています。ページがたくさんあるので、すべてのページを1つの大きな複数ページのテンプレートに保持するのではなく、個別のページテンプレートに保存します。メニューボタンをクリックすると、リストビューメニューを含むポップアップが表示されます。これは機能しますが、メニューをすべてのページテンプレートに配置する必要がありますが、メニューを独自のhtmlファイルまたはどこかに保持したいだけです。各ページテンプレートでコードを繰り返す必要がないように、jqueryモバイルページ構造の外側にあるdom。

メニューが独自のファイルにある場合、ポップアップにメニューをロードするにはどうすればよいですか？それができない場合、jqueryモバイルページ内にないポップアップにdivをロードするにはどうすればよいですか？

私のボタン：

   <a href="#main-menu" data-rel="popup">Menu</a>

私のリストビューメニューhtml：

 <div data-role="popup" id="main-menu">
        <ul data-role="listview" data-divider-theme="b" data-inset="true">
            <li data-role="list-divider" role="heading">
                Menu
            </li>
            <li data-theme="c">
                <a href="#how-it-works" data-transition="slide">
                    How it Works
                </a>
            </li>
            <li data-theme="c">
                <a href="http://www.backuptoweb.co.uk/buy-now/levels.html" data-transition="slide">
                    Order Now
                </a>
            </li>
            <li data-theme="c">
                <a href="#faq" data-transition="slide">
                    FAQ
                </a>
            </li>
            <li data-theme="c">
                <a href="#help" data-transition="slide">
                    Help
                </a>
            </li>
            <li data-theme="c">
                <a href="http://www.backuptoweb.co.uk/support.html" data-transition="slide">
                    Support
                </a>
            </li>
            <li data-theme="c">
                <a href="http://www.backuptoweb.co.uk/" data-transition="slide">
                   Main Website
                </a>
            </li>
        </ul>
 </div>
4

2 に答える 2

0

一般的な意味で、外部ファイルから html を div にロードする方法は次のとおりです。

$('#myDiv').load('somepath/somefile.html');
于 2012-12-28T13:50:29.803 に答える
0

私はまったく同じ問題を抱えています.ポップアップを表示しますが、部分的にCSSをレンダリングするものを書きました.

$('[data-role=page]').live('pageshow', function (event, ui) {

  $('#'+event.target.id).find('[id=main-menu]').load('menu.html', function(){
    $('#'+event.target.id).find('[id=main-menu]').trigger('create');
  });

});

ところで、メインの html ページには div 宣言が含まれている必要があります。

<div data-role="popup" id="main-menu"></div>
<a href="#main-menu" data-rel="popup">Menu</a>

また、menu.html には div 内のもののみを含める必要があります。

<ul data-role="listview" data-divider-theme="b" data-inset="true">
<!-- .... listview content ... -->
</ul>
于 2013-01-10T14:05:03.637 に答える