如何使用Bootstrap的標籤和jQuery Mobile的頁面？

Question

我正在使用Bootstrap for desktop和jQuery Mobile for mobile devices的網站上工作。我遇到了Bootstrap中的標籤與jQuery Mobile中的頁面的HTML結構問題。基本上，如果我使用Bootstrap的HTML（如下所示），jQuery Mobile網頁最終會嵌套。當jQuery Mobile data-role="page"標籤嵌套時，它似乎不起作用。有任何想法嗎？

<div class="tabbable" data-role="page"> <!-- Only required for left/right tabs --> 
    <ul class="nav nav-tabs"> 
     <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li> 
     <li><a href="#tab2" data-toggle="tab">Section 2</a></li> 
    </ul> 
    <div class="tab-content"> 
     <div class="tab-pane active" id="tab1" data-role="page"> 
      <p>I'm in Section 1.</p> 
    </div> 
    <div class="tab-pane" id="tab2" data-role="page"> 
     <p>Howdy, I'm in Section 2.</p> 
    </div> 
</div> 

Answer 1

我用來解決這個問題的解決方案是所謂的subpage一個jquery移動插件。

我改變了嵌套的頁面到子頁面，它的工作。