jQueryMobile选项卡在对话框中不起作用

时间:2014-04-16 03:41:59

标签: jquery-mobile jquery-dialog jquery-tabs

我正在使用jQueryMobile 1.4。 这是他们引入tabs的版本。

我可以让对话框单独工作。我也可以单独使用标签,但是当它与对话框配对时,它似乎无法正常工作。

我有一个玩具示例,用于说明问题github

如果直接转到dialog.html页面,则对话框和标签页可以正常工作。

但是如果你从index.html页面开始,然后点击链接弹出打开对话框,则该过程失败。发生的事情是对话框暂时弹出,但随后又消失了。该网址也会更改为dialog.html,但内容是index.html的内容。

我的index.html打开包含以下代码的对话框页面:

$('#info').on('click', 'a', function(event) {
  event.preventDefault();
  $.mobile.pageContainer.pagecontainer('change','dialog.html');
});

我的dialog.html就是这样:

<div data-role="page" data-dialog="true">

<div data-role="header" data-theme="d">
  <h1>Dialog</h1>
</div>

<div data-role="content" data-theme="c">
  <div data-role="tabs">
    <div data-role="navbar">
      <ul>
        <li><a href="#tab1" data-ajax="false">tab1</a></li>
        <li><a href="#tab2" data-ajax="false">tab2</a></li>
        <li><a href="#tab3" data-ajax="false">tab3</a></li>
      </ul>
    </div>
    <div id="tab1">
      Content1
    </div>
    <div id="tab2">
      Content2
    </div>
    <div id="tab3">
      Content3
    </div>
  </div>
</div><!-- content -->

0 个答案:

没有答案