2013-06-21 113 views
0

在我的項目中,我有一些按鈕,它的圖標工作正常,但問題是當我長按按鈕,它仍然處於活動狀態,除非我按其他按鈕可以告訴什麼問題以及如何解決這個問題。
這裏是btn活動狀態的css代碼。按鈕仍然處於活動狀態長按jQuery移動

.ui-btn-active { 
border: 1px solid #ccc; 
background: #B4B7BA; 
font-weight: 700; 
color: #fff; 
cursor: pointer; 
text-shadow: 0 1px 0 #EDF1F4; 
text-decoration: none; 
background-image: -webkit-linear-gradient(#5393c5, #6facd5); 
background-image: -moz-linear-gradient(#5393c5, #6facd5); 
background-image: -ms-linear-gradient(#5393c5, #6facd5); 
background-image: -o-linear-gradient(#5393c5, #6facd5); 
background-image: linear-gradient(#5393c5, #6facd5); 
font-family: Helvetica, Arial, sans-serif } 
+0

可能重複主動在phonegap android](http://stackoverflow.com/questions/17228775/jquery-mobile-button-state-remains-active-in-phonegap-android) – Omar

回答

1

我遇到過類似的問題,並圍繞它的工作像這樣的東西:

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Test App</title> 

    <script type="text/javascript" src="cordova-2.8.0.js"></script> 
    <script type="text/javascript" src ="assets/lib/jquery-1.9.0.min.js"></script> 
    <script type="text/javascript" src ="assets/lib/jquery.mobile-1.2.0.min.js"></script> 
    <link rel="stylesheet" href="assets/lib/jquery.mobile-1.2.0.css" type="text/css" /> 

    <script type="text/javascript" > 
     $.mobile.defaultPageTransition = 'none'; // Remove default page transition 
     $('div[data-role="page"]').on('pagecreate',function(event, ui){ 
      $('div[data-role="footer"] a', $(this)).on("taphold",function(e){ 
       $(this).addClass("ui-btn-active"); 
       $(this).one("touchend", function(e){ 
         e.preventDefault(); 
         $(this).trigger("click", e.data); // Remove this if you don't want the long press to act as a click 
         $(this).removeClass("ui-btn-down-a ui-btn-active"); 
         return false; 
        }); 
       }); 
      }); 
    </script> 
</head> 
<body> 
    <div data-role="page" id="page-1"> 
     <div data-role="content">     
      <p>Page 1</p> 
     </div> 
     <div data-role="footer" data-position="fixed"> 
      <div data-role="navbar"> 
       <ul> 
        <li><a href="#page-1">Page 1</a></li> 
        <li><a href="#page-2">Page 2</a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <div data-role="page" id="page-2"> 
     <div data-role="content">   
      <p>Page 2</p> 

     </div> 
     <div data-role="footer" data-position="fixed"> 
      <div data-role="navbar"> 
       <ul> 
        <li><a href="#page-1">Page 1</a></li> 
        <li><a href="#page-2">Page 2</a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</body> 
</html> 

您可以下載我的Eclipse項目和編譯APK here

[jQuery Mobile的按鈕狀態保持的
+0

嘿感謝回覆我得到錯誤未捕獲TypeError:對象[對象對象]沒有方法'l ive'當我谷歌我發現.live方法已經從1.9 jquery中刪除,所以有任何其他方法。 –

+0

用.on()替換.live() - [請參閱此處](更新我的答案)(http://stackoverflow.com/questions/14354040/jquery-1-9-live-is-not-a-function)因此 – DaveAlden

+0

感謝它的工作。 –

相關問題