Ajax 帖子不起作用 - Jquery Phonegap Android答案

【问题标题】：Ajax post not working - Jquery Phonegap AndroidAjax 帖子不起作用 - Jquery Phonegap Android
【发布时间】：2012-11-08 12:49:57
【问题描述】：

大家好，提前谢谢。我正在使用 Phonegap 2.1.0。在白名单中，所有内容都被接受..

**<access uri="*" subdomains="true" />
<access origin=".*" subdomains="true"/>**

我正在使用这个函数从我的大学网络服务器调用一个远程 php 文件：

var postData = $(this).serialize();             
                $.ajax({
                    type: 'POST',
                    url: 'http://--/smartphone/login.php',
                    dataType : 'json',
                    data: postData,         
                    success: function(data){
                        alert("good");
                    },
                    error: function(){
                        alert('problem!');
                    }
                });

该 php 文件只是出于调试原因，如下所示：

    <?php
header('Content-Type: application/json');
$sample = array(
    'name'=>'My Name',
    'email'=>'my_email@example.com'
);
echo json_encode($sample);
?>

但是 ajax 请求没有发生.. 在 Eclipse 中，当我单击提交时，我不断收到此错误：

JSCallback Error: Request failed with status 0 at file:///android_asset/www/js/cordova-2.1.0.js:3743

更重要的是，我忘了补充，我可以从模拟器打开网址作为链接。它工作正常。

*html代码：*

<!DOCTYPE html>
 <html lang="en">
 <head>
   <meta charset="utf-8">
   <link rel="stylesheet" type="text/css" href="css/index.css" />
   <script type="text/javascript" charset="utf-8" src="js/cordova-2.1.0.js"></script>
   <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
   <script type="text/javascript" src="js/index.js"></script>
   <title>Smart Greenhouse</title>
 </head>
 <body>
  <div id="container">
      <img src="css/images/smart_green_house.png" class="logo" alt="l1ogo" />
      <form id="login_form" class="first_display" >
          <label class="title"> E-mail:</label>
          <input id="1" type="email" class="input" size="45" name="email" />
          <label class="title"> password:</label>
          <input id="2" type="password" class="input" size="45" name="password" />
          <input id="3" class="submit_type" type="submit" value="login" />
      </form>
  </div>
 </body>
 </html>

我已经搜索了我认为几乎整个网络...2天搜索...一切都经过测试.. 非常感谢..

【问题讨论】：

http://--/smartphone/login.php 是一个有效的 URL 吗？我觉得不像。
-- 代表域..like mydomain.example.com.. 如果这被误解了，我深表歉意..
尝试在PHP端添加“Access-Control-Allow-Origin: *”HTTP-header，看看是否有效。
onon15.感谢您的回复..不幸的是问题仍然存在..
刚刚搜索了一下，发现了一些类似错误的问题，都与phonegap 2.1.0有关，是否可以尝试phonegap 2.2.0？

标签： android jquery ajax cordova

【解决方案1】：

最后，经过 4 到 5 天的搜索..对我来说有些事情..我刚刚在 ajax 回调之后添加了return false。我将代码更改如下：

$('form').submit(function(e){       
    if (password_ok==1 && email_ok==1)
            {
                var postData = $(this).serialize();
                $.ajax({
                    type: 'POST',
                    url: 'http://mysite.xx.x/smartphone/login.php',
                    dataType : 'json',
                    data: postData,         
                    success: function(data){
                        alert(data);
                    },
                    error: function(){
                        alert('error!');
                    }
                });
            }
        else
            {
            e.preventDefault();
            if (email_ok==2)
                {
                $("#1").css("border-color","red");
                $("#1").css("background-color","#FFD8CE");
                }
            if (password_ok==2)
                {
                $("#2").css("border-color","red");
                $("#2").css("background-color","#FFD8CE");
                }
            }
    return false;       
    });

现在唯一的问题是成功时它不会重置页面..而是一次一步...

【讨论】：

【解决方案2】：

第 1 步：您需要在 php 文件中包含两个标头

header('Content-Type: application/json');
header("Access-Control-Allow-Origin: *");

第 2 步：并在您的索引页面中包含 cdn jquery 库。

第三步：使用脚本成功发布表单

<script type="text/javascript">
    $(document).ready(function() {
        $('form').submit(function(e) {
            var postData = $(this).serialize();
            $.ajax({
                type : 'POST',
                url : 'http://www.yoururl/test.php',
                dataType : 'json',
                data : postData,
                success : function(data) {
                    alert(data);
                },
                error : function() {
                    alert('error!');
                }
            });

            return false;
        });
    });
</script>

我已经在 phonegap 中对其进行了测试，它工作正常。

【讨论】：

【解决方案3】：

我认为原因是“表单提交”引起的。你把你的ajax代码放在哪里了？在 index.js 中？

您遇到的异常意味着“0 == 页面正在卸载”。

在您的情况下，我猜您将 ajax 代码放在 index.js 中，它与表单位于同一页面中。当您提交表单时，浏览器开始卸载当前页面并加载包含表单提交结果的页面。因此，您的 ajax 代码会出现“页面正在卸载”异常。

尽量不要使用表单提交。

【讨论】：

Markthanx 尝试了很多。但我都尝试了，但什么也没发生。我知道错误的含义是什么。它可能是我的 androidmanifest.xml 文件或 cordova.plist 中的内容吗？
我认为它永远不会起作用..我不知道为什么..本地主机都不起作用..我不知道问题可能出在哪里..
实际上，当我删除“form”时，只需让ajax直接调用php，它就可以了。例如，您可以在 deviceready 事件监听器函数中添加您的 ajax 调用。然后看看结果。