Question

我有2页

<div data-role="page" align="center" id="loginDivId">
</div>

<div data-role="tabs" id="tabs">
  <div data-role="navbar">
    <ul>
      <li><a href="#tabs-1">Tab 1</a></li>
      <li><a href="#tabs-2">Tab 2</a></li>
      <li><a href="#tabs-3">Tab 3</a></li>
    </ul>
  </div>
</div>

基本上我向用户显示loginDivId，他们输入一些数据，当他们点击按钮时，我显示div为id = tabs

问题是，我可以在登录屏幕上向上滑动并查看选项卡屏幕。这是在登录之前和之后。

我想要的是登录div显示和用户看不到标签div的任何部分。然后我想完全删除登录div，只显示选项卡div。

Jquery Mobile是否允许您在同一个应用程序中将div与不同的数据角色（在我的案例页面和标签中）混合使用？

Answer 1

假设您有一个类为okValid的按钮：

<div data-role="page" align="center" id="loginDivId">
    <button type="button" class="okValid">Ok</button>
</div>

<div data-role="tabs" id="tabs" style="display:none;>
  <div data-role="navbar">
    <ul>
      <li><a href="#tabs-1">Tab 1</a></li>
      <li><a href="#tabs-2">Tab 2</a></li>
      <li><a href="#tabs-3">Tab 3</a></li>
    </ul>
  </div>
</div>

与js相关：

$(document).ready(function() {
  $('okValid').click(function () {
    $('#loginDivId').fadeOut(250);
    $('#tabs').fadeIn(250);
  }); 
});

jquery移动标签为第2页

1 个答案: