jQuery Mobile的導航欄圖標出現兩次

在我的jQuery Mobile的的NavBar的圖標出現了兩次，不明白爲什麼，從jQuery的文檔jQuery Mobile的導航欄圖標出現兩次

<link rel="stylesheet" 
     href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>

和導航欄本身

<div data-role="navbar" class="ui-navbar" role="navigation"> 
    <ul class="ui-grid-b"> 
    <li class="ui-block-a"> 
     <a id="showlatest" data-icon="grid" data-theme="a" 
     class="ui-btn-active ui-btn-icon-top ui-btn-up-a"> 
     <span class="ui-btn-inner" aria-hidden="true"> 
      <span class="ui-btn-text">Latest</span> 
      <span class="ui-icon ui-icon-grid ui-icon-shadow"></span> 
     </span> 
     </a> 
    </li> 
    <li class="ui-block-b"> 
     <a id="showstages" data-icon="star" 
     class="ui-btn ui-btn ui-btn-up-a ui-btn-icon-top" data-theme="a"> 
     <span class="ui-btn-inner" aria-hidden="true"> 
      <span class="ui-btn-text">Top</span> 
      <span class="ui-icon ui-icon-star ui-icon-shadow"></span> 
     </span> 
     </a> 
    </li> 
    <li class="ui-block-c"> 
     <a id="showclass" data-icon="gear" data-theme="a" 
     class="ui-btn ui-btn-up-a ui-btn-icon-top"> 
     <span class="ui-btn-inner" aria-hidden="true"> 
      <span class="ui-btn-text">Other</span> 
      <span class="ui-icon ui-icon-gear ui-icon-shadow"></span> 
     </span> 
     </a> 
    </li> 
    </ul> 
</div>

輸出複製的代碼如下圖所示： http://tinypic.com/r/1fcppz/5

有關爲什麼會發生這種情況的建議？

來源

2013-05-02 user2343254

如果您的問題已解決，請將任何一個標記爲答案。謝謝。 – clu3Less 2013-05-02 13:56:17

您不必明確指定跨度標籤。它們是由jQuery插件本身爲您生成的。嘗試用此代碼替換。

<div data-role="navbar" class="ui-navbar" role="navigation"> 
    <ul class="ui-grid-b"> 
    <li class="ui-block-a"> 
     <a id="showlatest" data-icon="grid" data-theme="a" 
     class="ui-btn-active ui-btn-icon-top ui-btn-up-a">Latest</a> 
    </li> 
    <li class="ui-block-b"> 
     <a id="showstages" data-icon="star" 
     class="ui-btn ui-btn ui-btn-up-a ui-btn-icon-top" data-theme="a">Top</a> 
    </li> 
    <li class="ui-block-c"> 
     <a id="showclass" data-icon="gear" data-theme="a" 
     class="ui-btn ui-btn-up-a ui-btn-icon-top">Other</a> 
    </li> 
    </ul> 
</div>

來源

2013-05-02 13:38:49 clu3Less

已選擇，謝謝！ – user2343254 2013-05-02 14:29:57

在你的代碼刪除這個多餘的跨度，似乎大功告成：

<span class="ui-icon ui-icon-star ui-icon-shadow"></span>

Fiddle

來源

2013-05-02 13:26:23 Eli

jQuery Mobile的導航欄圖標出現兩次

回答

相關問題