3

私は何百ものページをhtmlページに入れるプロジェクトに取り組んでいます。

サブページ間を移動するためにこのサブページをナビゲートすることについて非常に懸念してい<a href=#ID" >ます。すべてのサブページ ID をすべての「次へ」ボタンに書き込む必要がないように、次のサブページに移動するすべてのサブページに 1 つのボタンを使用する方法はありますか?

4

2 に答える 2

6

戻るボタン ：

jQuery Mobile には、すべてのページに戻るボタン用のすぐに使えるソリューションがあります。

<script>
    $(document).on('mobileinit', function () {
        $.mobile.ignoreContentEnabled = true;
    });
</script>

このコードは、次のように、jQuery Mobile の初期化の前に配置する必要があります。

<head>
  <title>Share QR</title>
  <meta name="viewport" content="width=device-width, initial-scale=1"/>     
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />   
  <script>
    $(document).on('mobileinit', function () {
        $.mobile.ignoreContentEnabled = true;
    });
  </script>    
  <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>

次へボタン :

これは少しトリッキーです。自動生成された次のボタンは、複数ページのソリューションを持つ 1 つの html がある場合にのみ機能します。これにより、次のページの情報が提供されるため、次のボタンを作成するには、次のコードを使用します。

$(document).on('pagebeforeshow', '[data-role="page"]', function(){       
    var nextpage = $(this).next('div[data-role="page"]');
    if (nextpage.length > 0) {    
        $.mobile.activePage.find('[data-role="header"]').append($('<a>').attr({'href':'#'+nextpage.attr('id'),'data-theme':'b'}).addClass('ui-btn-right').html('Next').button());
    }  
});

作業例:

このソリューションの実例を次に示します: http://jsfiddle.net/Gajotres/BnB7X/

さらに質問がある場合は、お気軽にお問い合わせください。

于 2013-02-27T20:16:01.710 に答える