-1

モバイル アプリケーションの開発に JQuery Mobile を使用しています。私は私の見解を設計しました。テスト時にブラウザで正常に動作しますが、モバイル デバイスでは黒い画面が表示されます。経験を共有してください。

私のログイン画面:

    <!DOCTYPE html>     
    <html>
    <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0" />
    <title>MyApp</title>
    <link rel="shortcut icon" href="images/favicon.png" />
    <link rel="apple-touch-icon" href="images/apple-touch-icon.png" />
    <link rel="stylesheet" href="css/jquerymobile120.css" />
    <link rel="stylesheet" href="css/default320.css" />     
    </head>
    <body id="content" style="display: none">
<div data-role="page" id="login" class="MainCon">
<div class="MastHead" data-role="header" data-position="fixed" data-tap-toggle="false">
<div class="MastHeadInner">
<div class="HeaderLogo"><img alt="" title="" src="images/logo.png"  /></div>

</div>
</div>

    <div data-role="content">

            <div id="AuthDiv" class ="LoginBox" style="display:none">
                <div  class="LogBoxCon">
                    <p>
                        <input type="text" name="name" class="iconin" placeholder="user ID" id="AuthUsername"/>
                    </p>
                    <p>
                        <input type="password" name="password"  class="iconid" placeholder="password" id="AuthPassword"/>
                    </p>
                    <div class="BtnLog">
                        <a class ="LightGrayBtn LoginBtn" href="#" id="AuthSubmitButton">login</a>
                    </div>
                </div>
            </div> 
        </div>

</div>

4

1 に答える 1

1

質問に貼り付けた HTML ファイルのすべての Worklight 関連部分はどこにありますか?
この HTML コードは... アプリケーションの MAIN HTML ファイルにありますか、それともあなたのものですか? 追加の HTML ファイルの場合、どのようにロードしますか?

基本的な HTML ファイルは次のようになります。以下と比較して、不足しているすべての参照に注意してください。

<!DOCTYPE HTML>
<html>
        <head>
            <meta charset="UTF-8">
            <title>testapp</title>
            <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
            <link rel="shortcut icon" href="images/favicon.png">
            <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
            <link rel="stylesheet" href="css/testapp.css">
            <script>window.$ = window.jQuery = WLJQ;</script>
        </head>
        <body id="content" style="display: none;">
            <!--application UI goes here-->
            testapp
            <script src="js/initOptions.js"></script>
            <script src="js/testapp.js"></script>
            <script src="js/messages.js"></script>
        </body>
</html>
于 2013-08-22T05:26:02.710 に答える