jQuery Mobile選項卡顯示所有選項卡的內容

Question

我正在嘗試設置一個選項卡式導航欄，但它沒有隱藏其他選項卡中的內容。

同樣，創建新頁面的方法也不相同。 它顯示另一頁的內容，就像我正常編寫它一樣。

<!-- Chat Display and Tabs -->
   <div id="tabs" data-role="tabs">
      <div data-role="navbar">
        <ul>
          <li><a href="#globalChat" data-ajax="false">Global Chat</a></li>
          <li><a href="#allyChat" data-ajax="false">Alliance Chat</a></li>
          <li><a href="#privateChat" data-ajax="false">Private Chat</a></li>
        </ul>
      </div>
      <div id="#globalChat" class="ui-body-d ui-content">
        <div id="incomingMessages" name="incomingMessages" class="msgContainerDiv" ></div> <!-- Global Chat Display -->
      </div>
      <div id="#allyChat" class="ui-body-d ui-content">
        <div id="incomingAMessages" name="incomingMessages" class="msgContainerDiv" ></div> <!-- Global Chat Display -->
      </div>
      <div id="#privateChat" class="ui-body-d ui-content">
        <div id="incomingPMessages" name="incomingMessages" class="msgContainerDiv" ></div> <!-- Global Chat Display -->
      </div>
   </div>

頭標簽：

<head>
<title>Mod Panel</title>
<meta http-equiv=content-type content=text/html;charset=utf-8>

<meta name=viewport content=width=device-width>
<meta name=viewport content=initial-scale=1.0>
<meta name=viewport content=user-scalable=no>

<meta name=apple-mobile-web-app-capable content=yes>  
<meta name=apple-mobile-web-app-status-bar-style content=black>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<link href="css/toastr.css" type="text/css" rel="stylesheet" />

<script src="http://code.jquery.com/jquery-1.7.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
 <script src="js/md5.js"></script>
 <script src="js/common.js"></script>
<script src="js/toastr.js"></script>
<script src="js/dateFormat.js"></script>
<script src="js/main.modpanel.js"></script>
<script src="js/blacklist.js"></script>
</head>

Plunker

Answer 1

您的問題出在#globalChat ， #allyChat和#privateChat div的id 。 設置ID時，哈希（ # ）不應放在名稱的前面，只有在引用ID時才在哈希前面。

例如：

<div id="#globalChat" class="ui-body-d ui-content">

應該

<div id="globalChat" class="ui-body-d ui-content">

為了被

<a href="#globalChat" data-ajax="false">Global Chat</a>

設置id='#globalChat意味着您需要引用##globalChat （我什至不確定這是否行得通）。

我已經分叉了，標簽與更新的ID配合良好。

聯盟聊天全球聊天

jQuery Mobile選項卡顯示所有選項卡的內容

問題描述

1 個解決方案

解決方案1
0 2015-05-07 12:46:05

jQuery Mobile選項卡顯示所有選項卡的內容

問題描述

1 個解決方案

解決方案1 0 2015-05-07 12:46:05

解決方案1
0 2015-05-07 12:46:05