停止標籤欄刷新jquery的移動1.3.1

我跑JQM 1.3.1 + JQ 2.0停止標籤欄刷新jquery的移動1.3.1

我有大約60個元素+固定頁腳的列表視圖（沒有滾動）（的TabBar）。如果我點擊我的列表視圖中的一個元素，它會在一個新的哈希頁面中顯示一些內容，我在其中添加了「後退」按鈕。

當填充列表視圖時，設置tabbar的活動按鈕。

當我點擊後退按鈕時，前一頁顯示，但是從tabbar的活動按鈕不再活動（沒有任何按鈕處於活動狀態）。這使我認爲第一頁上的所有元素都被刷新了。

如何防止元素被刷新並保持其狀態爲「後退」？

<div data-role='navbar' id='kms'> 
     <ul id='kml'> 
     <li id='l5'><a href='#' id='d5' class='ui-btn-active'>Ici</a></li> 
     <li id='l20'><a href='#' id='d20'>5 km</a></li> 
     <li id='l50'><a href='#' id='d50'>20 km</a></li> 
     <li id='l100'><a href='#' id='d100'>50 km</a></li> 
     </ul> 
    </div>

來源

2013-05-19 Alain Zelink

您可以發佈您的JS代碼？ – Omar

從標籤欄中刪除類ui-btn-active。並編寫自己的定製css類的主動和被動選項卡。它爲我工作。這可能會有所幫助。

.footer-passive a 
{ 
background: #99ce3e ; /*light green*/ 
}

主動按鈕

.footer-active a 
{ 
background: #709630;/*dark green*/ 
}

那麼請嘗試使用下面的代碼片段。

<div data-role="footer" data-theme="b" data-position="fixed"> 
    <div data-role="navbar"> 
     <ul> 
      <li class="footer-color-active"><a href="sample1.html" class="ui-btn-active"><img src="your_file/path1" /></a></li> 
      <li class="footer-color"><a href="sample2.html" ><img src="your_file/path2" /></a></li> 
      <li class="footer-color"><a href="sample3.html" ><img src="youtr_file/path3" /></a></li> 
     </ul> 
    </div> 
</div>

來源

2013-05-20 05:39:08 Daenarys

嘿。感謝您的回答。我還沒有成功刪除ui-btn-active。我在所有按鈕上調用removeClass（'ui-btn-active'），但無效。當我點擊按鈕時，默認回來。 –

好的，請參閱上面編輯的答案。讓我們看看它是否有幫助。 – Daenarys

工作例如：http://jsfiddle.net/Gajotres/6h7gn/

$(document).on('pagebeforeshow', '#index', function(){ 
    $(document).on('click', '#kml li', function(){ 
     var selectedLi = $(this); 
     $('#kml li').each(function(index) { 
      var loopLi = $(this); 
      if(loopLi.find('a').hasClass('ui-btn-active')) { 
       $(this).find('a').removeClass('ui-btn-activ').removeClass('ui-state-persist'); 
      } 
     });   
     selectedLi.find('a').addClass('ui-state-persist');   
     setTimeout(function(){ 
      $.mobile.changePage("#second", { transition: "slide"}); 
     },100); 
    });  
});

來源

2013-05-20 08:59:35 Gajotres

謝謝你的回答。我的第二頁沒有導航欄。但是使用'ui-state-persist'並在每個按鈕上使用toggleClass On/Off工作！ –

順便說一句，我發現addClass（）/ removeClass比toggleClass（）快兩倍。 –

停止標籤欄刷新jquery的移動1.3.1

回答

相關問題