2014-02-21 12 views
1

我正在使用phonegap + Jquery mobile開發android應用程序。我的應用程序在listview div中顯示列表,但是外觀和感覺不像2.3.3,在3.0以上的版本上工作正常。 以下是我的index.html頁面。請建議我回答。jQuery的移動列表視圖外觀和感覺不工作android 2.3.3?

<!DOCTYPE HTML> 
<html> 
    <head> 

     <title>ListView</title> 
     <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/> 
     <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/> 
     <link rel="stylesheet" href="js/jquery.mobile-1.4.1.css" /> 
     <script src="js/jquery-1.10.2.min.js"></script> 
     <script src="cordova.js"></script> 
     <script src="js/jquery.mobile-1.4.1.js"></script> 

    </head> 
    <body> 
     <div data-role="page" id="courseList"> 
      <div data-theme="a" data-role="header"> 
       <h3> 
        Course List 
       </h3> 
      </div> 
      <div data-role="content">  
       <!-- <div class="example-wrapper" data-iscroll> --> 
        <ul data-role="listview" id="output" data-theme="b"> 
        </ul> 
       <!-- </div> --> 
      </div> 
     </div> 
    </body> 
    <script> 

$(document).ready(function() { 

    if(window.isphone) { 
     document.addEventListener("deviceready", onDeviceReady, false); 
    } else { 
     onDeviceReady(); 
    } 

}); 

// device APIs are available 
function onDeviceReady() { 
    // Now safe to use device APIs 
    $.ajax({ 
     url:"http://www.cilibrary.ojaswitech.com/getLatestNews", 
     // crossDomain: true, 
     //type  : "POST", 
     dataType: 'json', 
     async: true, 
     success: function (result) { 
      $.each(result, function(i, item) { 
        $('ul').append('<li><a href="">' + item + '<p></li>'); 
       }); 
     $('#output').listview("refresh"); 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
      alert(xhr.status); 
      alert(thrownError); 
     } 
    })  
} 
</script> 
</html> 

以下是兩張圖片。第一是左側圖像2.3.3和第二是右側圖像4.2.2

enter image description here

回答

0

這是其在1.4.1版本和效果的Android 2.3.x版本設備和IE8引入已知錯誤。問題出現在jquerymobile.js的行31953222。有一個default屬性恰好是保留關鍵字。

你可以通過修改這兩行來解決這個問題;

duration = $.fn.animationComplete.default; // this 
duration = $.fn.animationComplete.defaultDuration; // to this 
// and 
$.fn.animationComplete.default = 1000; // this 
$.fn.animationComplete.defaultDuration = 1000; // to this 

或等到版本1.4.2與此錯誤的修復程序一起出局。

Reference

+0

感謝您的答案..但也有其他問題也在jquery手機這就是爲什麼我沒有使用jQuery的手機。 –

0

Acctually有可能是一個更簡單的方法。試着用替換:

$('#output').listview("refresh"); 

與此相反:

$('#output').listview("create"); 

=)祝你好運!
丹尼