2017-11-26 9 views
0

私はアンドロイドデバイスでアプリケーションを作成する方法を見てwww3schoolsの例を使用しています。jqueryモバイルサイトがアンドロイドデバイスでフォーマットしていません

<!DOCTYPE html> 
    <html> 
    <head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" 
    href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"> 
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile- 
    1.4.5.min.js"></script> 

    <script> 
    var _hmt = _hmt || []; 
    (function() { 
    var hm = document.createElement("script"); 
    hm.src = "//hm.baidu.com/hm.js?73c27e26f610eb3c9f3feb0c75b03925"; 
    var s = document.getElementsByTagName("script")[0]; 
    s.parentNode.insertBefore(hm, s); 
    })(); 
    </script> 
    </head> 
    <body> 

    <div data-role="page" id="pageone" data-theme="a"> 
    <div data-role="header"> 
    <h1>Page Header</h1> 
    </div> 

    <div data-role="main" class="ui-content"> 
    <p>Some Text..</p> 
    <a href="#">A Standard Text Link</a> 
    <a href="#" class="ui-btn">Link Button</a> 
    <p>A List View:</p> 
    <ul data-role="listview" data-autodividers="true" data-inset="true"> 
    <li><a href="#">Adele</a></li> 
    <li><a href="#">Billy</a></li> 
    </ul> 
    <label for="fullname">Input Field:</label> 
    <input type="text" name="fullname" id="fullname" placeholder="Name..">  
    <label for="switch">Toggle Switch:</label> 
    <select name="switch" id="switch" data-role="slider"> 
    <option value="on">On</option> 
    <option value="off" selected>Off</option> 
    </select> 
    </div> 

    <div data-role="footer"> 
    <h1>Page Footer</h1> 
    </div> 
    </div> 

    </body> 
    </html> 

以下のスクリーンショットは、コンピュータのブラウザのビューを示しています。

enter image description here

は、以下のスクリーンショットは、私のAndroidデバイス上のブラウザ図を示しています。アンドロイドバージョン7を実行中。

enter image description here

私は、Androidデバイスにダウンロードされたアプリを作成するために、PhoneGapのオンラインビルドを使用しています。私はなぜこれがアンドロイドデバイスで同じレンダリングされていないのかわかりません。私はそれぞれのブラウザで同じブラウザを使用しています。 ガイダンスをいただければ幸いです。

答えて

0

私はこれを最終的に解決しました。私は、index.htmlだけをオンライン電話ギャップビルドサービスにアップロードしていました。これで、ローカルデバイスにリンクするときにphonegapが使用する他のファイルが含まれています。これで問題は解決しました。私はこれらがオンラインビルドサイトによって自動的に追加されたと考えました。電話のアプリのスクリーンショットをご覧ください。

App on phone

関連する問題