0

我正在android上制作一个移动应用程序，我使用phonegap、移动jquery ajax codeigniter和mysql。我的登录过程有问题。我的 AJAX 请求一直失败。我在我的注册过程中使用了同样的东西并且它有效。很奇怪.. 这是我在 phonegap 上 login.html 上的代码：

   <!DOCTYPE html> 
<html> 
    <head> 
    <title>Login</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
    <script type="text/javascript">

    $(document).ready(function(){

$("input[type=text]").val('');

document.addEventListener("deviceready", init, false);


function init() {

$('a[id^="submitButton"]').on('click',function(){
$("#submitButton",this).attr("disabled","disabled");
//$("#loginForm").on("submit",function() {


  u = $("#username").val();
  p = $("#password").val();


 if(u!='' && p!='') {



                 $.ajax({

                     url:'http://****.dyndns-home.com/health/index.php/health_login?username='+u+'&password='+p,

                     dataType:'json',
                     success:function(data, textStatus, jqXHR) 
                        {
                        $.mobile.changePage("menu1.html");

                         if(data.status==1) {
                         localStorage.setItem("username", u);
                         localStorage.setItem("password", p);

                         $.mobile.changePage("menu1.html");
                         $("input[type=text]").val('');


                         }
                          if(data.status==0){
                          alert("Wrong username or password!");
                          $("input[type=text]").val('');
                          }


                         },

                         error: function(jqXHR, textStatus, errorThrown){
                        alert('AJAX request failed');
                        }

                         });
}
else{
alert("You must enter a username and password");
}
 return false;




});
}
});
    </script>

</head> 



<body> 
<div data-role="page"> 

    <div data-role="header" >

    <h2>Login</h2></div> 
    <div data-role="content">
    <form id="loginForm">
    Username: <input type="text" id="username" value=""  name="username"/>
    Password:<input type="text" id="password" value=""   name="password"/>
    <a href="forget.html" > Ξέχασες τον κωδικό ή το όνομα χρήστη;</a><br>
    <a href="index.html" data-role="button" data-transition="turn" data-inline="true" data-icon="back" >Back</a>
    <a href="" id="submitButton" name="submitButton" data-role="button" data-inline="true" data-theme="b" data-icon="forward">Είσοδος</a>


    </form>
    </div> 
    <div data-role="footer" data-position="fixed"><h2></h2></div> 

</div> 
</body>
</html>

此外，当我在 chrome 和 mozzila 上将 login.html 作为 Web 应用程序运行时，我没有遇到任何问题，ajax 请求成功！我在 Eclipse 上使用 api 级别 15（android 4.0.3）运行此应用程序。

告诉我你是否需要我的 register.html 代码。

你怎么看？我现在正在寻找解决这个问题 2 天，但我无能为力。

谢谢！

4

1 回答 1

0

打开模拟器的浏览器并键入 Internet 地址以验证模拟器是否能够连接到 Internet。否则页面中的 JS 和 CSS 将无法加载。

如果模拟器能够连接到 Internet，您可以尝试以下代码。我对您的代码进行了一些改进。例如，jQuery 框架在同一个页面中被多次加载。以下代码已在 Android 中进行了测试。

此外请注意，您用于保存凭据的 localStorage 存储的数据没有过期日期。您应该考虑使用 sessionStorage 而不是本地存储。sessionStorage 存储一个会话的数据。

<!DOCTYPE html> 
<html> 
    <head> 
        <title>Login</title> 
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
        <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
        <script type="text/javascript">

            /**
             * Clears all the inputs in the page.
             */
            function clearPageInputs() {
                $("input[type=text]").val('');
            }


            /**
             * Trim function
             */
            String.prototype.trim = function() {
                a = this.replace(/^\s+/, '');
                return a.replace(/\s+$/, '');
            };

            /**
             * Submits the login form
             */
            function sumbitLoginForm(user, pass) {
                if (user.trim() == '' || pass.trim() == '')
                {   
                    // fill username and password in Greek language
                    alert("\u03a3\u03c5\u03bc\u03c0\u03bb\u03ae\u03c1\u03c9\u03c3\u03b5 \u03c4\u03bf Username \u03ba\u03b1\u03b9 \u03c4\u03bf Password!");
                }
                else
                {
                    $.ajax({
                        type: 'post',
                        url: 'http://.../.../...',
                        data: { username: user, password: pass },
                        dataType: 'json',
                        success: function(data) {
                            if(data && data.status == 1) {
                                // save in local storage
                                localStorage.setItem("username", user);
                                localStorage.setItem("password", pass);
                                // perform page transition 
                                $.mobile.changePage("menu1.html");
                            }
                            else {
                                clearPageInputs()
                                // wrong username / password in Greek language
                                alert("\u0388\u03c7\u03b5\u03b9\u03c2 \u03ba\u03ac\u03bd\u03b5\u03b9 \u03ba\u03ac\u03c0\u03bf\u03b9\u03bf \u03bb\u03ac\u03b8\u03bf\u03c2 \u03c3\u03c4\u03bf Username \u03ae/\u03ba\u03b1\u03b9 \u03c3\u03c4\u03bf Password.");
                            }   
                        },
                        error: function (xhr, ajaxOptions, thrownError) {
                            alert("Error: " + xhr.status + "\n" +
                                   "Message: " + xhr.statusText + "\n" +
                                   "Response: " + xhr.responseText + "\n" + thrownError);
                        }
                    });
                }

                return false;
            }

            $(document).ready( function() {
                clearPageInputs();

                $("#submitButton").click(function(){
                    sumbitLoginForm($("#username").val(), $("#password").val());
                });
            });
        </script>
    </head>
    <body> 
        <div data-role="page"> 
            <div data-role="header" >
            <h2>Login</h2></div> 
            <div data-role="content">
                <form id="loginForm">
                    <label for="username">Username:</label>
                    <input type="text" id="username" value=""  name="username"/>
                    <label for="password">Password:</label>
                    <input type="text" id="password" value=""   name="password"/>
                    <a href="forget.html">Ξέχασες τον κωδικό ή το όνομα χρήστη;</a><br>
                    <a href="index.html" data-role="button" data-transition="turn" data-inline="true" data-icon="back" >Back</a>
                    <a href="#" id="submitButton" data-role="button" data-inline="true" data-theme="b" data-icon="forward">Είσοδος</a>
                </form>
            </div> 
            <div data-role="footer" data-position="fixed"><h2></h2></div> 
        </div> 
    </body>
</html>
于 2012-09-01T18:28:02.117 回答