jQuery移动页面在三星Galaxy S2上提出了代码



我已经写了一个WebApp,以跟踪我的游泳的统计信息。它在我的桌面上正常工作,并且在Android移动模拟器中很好地工作,但是当我尝试使用Android浏览器在三星Galaxy S2上使用它时,它只是显示了一堆代码。这是在我登录后发生的。据我所知,下一页没有加载。

登录页面的代码(不确定是否相关)是:

<html>
    <head>
        <title>Login</title>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
        <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
    </head>
    <body>
        <div data-role="header">
            <h1>Home</h1>
        </div>
        <div data-role="content">

<form action="" method="post">
    <div style='display:none'><input type='hidden' name='csrfmiddlewaretoken' value='ILxbxRYRNmNwIzUKASEtTbhGG9gtorZf' /></div>
    <table>
        <tr><th><label for="id_username">Username:</label></th><td><input id="id_username" type="text" name="username" maxlength="30" /></td></tr>
<tr><th><label for="id_password">Password:</label></th><td><input id="id_password" type="password" name="password" maxlength="4096" /></td></tr>
    </table>
    <input type="hidden" name="next" value="/swimming/" />
    <input type="submit" value="Login" />
</form>
        </div>
        <div data-role="footer">
            <a href="/swimming/session/list" data-role="button">Session List</a>
            <a href="/swimming/accounts/logout/" data-role="button">Logout</a>
        </div>
    </body>
</html>

目标页面的代码(/游泳/)为:

<html>
    <head>
        <title>Home</title>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
        <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
    </head>
    <body>
        <div data-role="header">
<h1>Home</h1>
        </div>
        <div data-role="content">

        </div>
        <div data-role="footer">
            <a href="/swimming/session/list" data-role="button">Session List</a>
            <a href="/swimming/accounts/logout/" data-role="button">Logout</a>
        </div>
    </body>
</html>

它吐出的代码是:

").append(d);return function(a){if(!(a in b)){var h=document.createElement("style"),g="@media "+a+" { #jquery-mediatest { position:absolute; } }";h.type="text/css";h.styleSheet?h.styleSheet.cssText=g:h.appendChild(document.createTextNode(g));e.prepend(f).prepend(h);b[a]=d.css("position")==="absolute";f.add(h).remove()}return b[a]}}()})(jQuery);(function(a,e){function b(a){var b=a.charAt(0).toUpperCase()+a.substr(1),a=(a+" "+c.join(b+" ")+b).split(" "),d;for(d in a)if(f[a[d]]!==e)return true}var d=a("

我很抱歉,如果我的描述含糊不清,我对移动网页的新手很新,并且可能错过了一个细节。

是否使用多页模型或a 单页模型,所有元素均应包裹在<div data-role="page></div>中。<<<<<<<<<<

页面的表现为每个页面的body标签。jQuery Mobile寻找 page 来创建它并增强其元素。

旁注:我建议使用最新的jQuery移动版本 1.4

最新更新