在Phonegap项目中结合Ajax、Jquery、mysql、php不起作用

Posted

技术标签:

【中文标题】在Phonegap项目中结合Ajax、Jquery、mysql、php不起作用【英文标题】:Combining Ajax, Jquery, mysql, php in Phonegap project doesn't work 【发布时间】:2013-12-08 16:57:51 【问题描述】:

我尝试使用以下代码将数据发送到我的数据库,但它不起作用。代码写在这个例子之后(http://samcroft.co.uk/2012/posting-data-from-a-phonegap-app-to-a-server-using-jquery/)

如果有人知道出了什么问题...我很感激任何帮助。

html 表单

<form>
    <fieldset data-role="controlgroup">
        <legend>Pick your team:</legend>
        <input type="radio" name="team_name" id="red" value="on" checked="checked">
        <label for="red">Team Red</label>
        <input type="radio" name="team_name" id="blue" value="off">
        <label for="blue">Team Blue</label>       
    </fieldset>
    <fieldset data-role="controlgroup" data-type="horizontal">
        <legend>Choose your number:</legend>
        <input type="radio" name="player_number" id="1" value="on" checked="checked">
        <label for="1">1</label>
        <input type="radio" name="player_number" id="2" value="off">
        <label for="2">2</label>
        <input type="radio" name="player_number" id="3" value="off">
        <label for="3">3</label>
        <input type="radio" name="player_number" id="4" value="off">
        <label for="4">4</label>
        <input type="radio" name="player_number" id="5" value="off">
        <label for="5">5</label>
        <input type="radio" name="player_number" id="6" value="off">
        <label for="6">6</label>
        <input type="radio" name="player_number" id="7" value="off">
        <label for="7">7</label>
        <input type="radio" name="player_number" id="8" value="off">
        <label for="8">8</label>
        <input type="radio" name="player_number" id="9" value="off">
        <label for="9">9</label>
        <input type="radio" name="player_number" id="10" value="off">
        <label for="10">10</label>
    </fieldset>
    <label for="player_name">Your name:</label>
    <input type="text" name="player_name" id="player_name" value="">         
    <input type="submit" value="Submit">
</form>

Jquery/Ajax 代码

$('form').submit(function()
    var postData = $(this).serialize();

    $.ajax(
        type: 'POST',
        data: postData,
        url: 'http://www.kauwenberg.com/Commander/core/handleplayer_2.php', // 2 !!
        succes: function(data)
            console.log(data);
            alert(data);
            ,
        error: function()
            console.log(data);
            alert(data);
            
    );

    return false;
);

http://www.kauwenberg.com/Commander/core/handleplayer_2.php 上的 PHP 代码

<?php
$server = "localhost";
$username = "MA_SECRET";
$password = "MA_SECRET";
$database = "MA_SECRET";

$con = mysql_connect($server, $username, $password) or die ("Could not connect: " . mysql_error());

mysql_select_db($database, $con);

$team_name = mysql_real_escape_string($_POST["team_name"]);
$player_number = mysql_real_escape_string($_POST["player_number"]);
$player_name = mysql_real_escape_string($_POST["player_name"]);

$sql = "INSERT INTO players (team_name, player_number, player_name) ";
$sql .= "VALUES ($team_name, $player_number, $player_name)";

if (!mysql_query($sql, $con)) 
  die('Error: ' . mysql_error());
 else 
  echo "Comment added";


mysql_close($con);
?>

【问题讨论】:

有什么问题??是否重定向到表单操作(同一页面)而不发出警报?? “它只是不起作用”以什么方式?您的问题越具体、越明确,您获得答案的可能性就越大。 【参考方案1】:

您好,将您的提交按钮更改为&lt;input type="button" value="Submit" id="submit_button" /&gt;,然后将您的 jQuery 事件更改为以下内容:

$('#submit_button').bind('click',function(e)

    e.preventDefault();
    var postData = $(this).serialize();

    $.ajax(
        type: 'POST',
        data: postData,
        url: 'http://www.kauwenberg.com/Commander/core/handleplayer_2.php', // 2 !!
        success: function(data)
            console.log(data);
            alert(data);
        ,
        error: function()
            console.log(data);
            alert(data);
        
    );
    return false; 
);

它会提醒服务器返回的响应将显示在提醒对话框中。

【讨论】:

【参考方案2】:

你也有拼写错误:

成功:函数(数据)

“成功”就是这个词。

【讨论】:

【参考方案3】:

注意:您没有在 SQL 代码中引用您的 $team_name、$player_number 和 $player_name,这可能非常危险。如果没有正确引用查询中的值,则使用 mysql_real_escape_string 的事实并不重要;它们仍然会被解析为普通 SQL。

$sql .= "VALUES ('$team_name', '$player_number', '$player_name')";

这可能不是它目前无法正常工作的原因,但当您开始处理其他事情时,它肯定会回复您。

另外,检查您的 AJAX 请求是否到达服务器。如果您的请求跨越多个域,您的请求可能会被手机的安全策略阻止。

【讨论】:

【参考方案4】:

您可以查看此页面上的最后一个问题

http://phonegap.com/about/faq/

我建议改用 JSON。

检查此链接 http://catchmayuri.blogspot.com/2012/01/working-with-json-phonegap-application.html

【讨论】:

【参考方案5】:
$(document).on('submit','form',function(e)
    e.preventDefault();
    var postData = $(this).serialize();
    $.post('http://www.kauwenberg.com/Commander/core/handleplayer_2.php',postData,
    function(data) 
        alert(data);
    );    
    return false;
);

试试这个

【讨论】:

以上是关于在Phonegap项目中结合Ajax、Jquery、mysql、php不起作用的主要内容,如果未能解决你的问题,请参考以下文章

使用 Ajax / JQuery / PhoneGap 重定向

使用 PhoneGap、AJAX 和 JQuery Mobile 连接到 MySQL 数据库

在 PhoneGap+jQuery Mobile 中使用 ajax 的 CORS 无法在设备上运行,但在浏览器上运行

使用Phonegap的IOS上的Jquery ajax请求-Ajax不起作用

jQuery Mobile + Phonegap :: Ajax "Loading" gif 没有动画

jquery mobile 与 phonegap 404 ajax 错误。但在 Firefox、IE 中运行良好