jquery mobile和json回调结果未显示

时间:2011-11-02 10:49:50

标签: jquery mysql json

我正在构建一个jquery移动应用程序,允许用户通过json发布和查看主题。服务器端使用php和mysql注入来捕获json数据。服务器端确实看到传递的值并成功将其注入sql。问题是它没有运行成功回调结果。

此错误日志显示在Chrome控制台上:"XMLHttpRequest cannot load http://xxxxxxx/newpost.php. Origin null is not allowed by Access-Control-Allow-Origin."如果我在参数中添加dataType: "jsonp",则错误更改为"Uncaught ReferenceError: SUCCESS is not defined."

这是我的HTML:

<div data-role="content">
            <div data-role="content">
                <form id="newPostForm">
                    <div data-role="fieldcontain">
                        <label for="postTitle"><strong>Post Title:</strong></label>
                        <input type="text" name="postTitle" id="postTitle" value=""  />

                        <label for="postContent"><strong>Post Content:</strong></label>
                        <textarea name="postContent" id="postContent"></textarea>

                        <fieldset class="ui-grid-a">
                            <div class="ui-block-a"><a href="#indexPage" id="cancel" data-role="button">Cancel</a></div>
                            <div class="ui-block-b"><button data-theme="b" id="submit" type="submit">Submit</button></div>
                        </fieldset>
                        <h3 id="notification"></h3>
                    </div>
                </form>
            </div>
        </div>

脚本:

function resetTextFields()
        {
            $("#postTitle").val("");
            $("#postContent").val("");
        }

        function onSuccess(data, status)
        {
            resetTextFields();
            // Notify the user the new post was saved
            $("#notification").fadeIn(2000);
            data = $.trim(data);
            if(data == "SUCCESS")
            {
                $("#notification").css("background-color", "#ffff00");
                $("#notification").text("The post was saved");
            }
            else
            {
                $("#notification").css("background-color", "#ff0000");
                $("#notification").text(data);
            }
            $("#notification").fadeOut(5000);
        }

        $(document).ready(function() {
            $("#submit").click(function(){

                var formData = $("#newPostForm").serialize();

                $.ajax({
                    type: "POST",
                    url: "http://xxxxxxxx/newpost.php",
                    cache: false,
                    data: formData,
                    success: onSuccess
                });

                return false;
            });

            $("#cancel").click(function(){
                resetTextFields();
            });

            $("#refresh").click(function(){
                location.reload();
            });
        });

这是php代码:

header('Content-type: application/json');
    try
    {
        $connection = mysql_connect("localhost","user","pass");
        mysql_select_db("dbtable", $connection);

        $postTitle = mysql_real_escape_string($_POST[postTitle]);
        $postContent = mysql_real_escape_string($_POST[postContent]);

        mysql_query("INSERT INTO weblogins (postTitle, postContent) VALUES ('$postTitle', '$postContent')");
        mysql_close($connection);
        echo "SUCCESS";
    }
    catch(Exception $e)
    {
        echo $e->getMessage();
    }

当按下按钮时,客户端没有任何反应,没有通知,但它确实将提交的表单注入sql。

我错过了什么?感谢。

1 个答案:

答案 0 :(得分:0)

您无法使用AJAX发布/获取不属于当前的域....

它的相同来源政策 - &gt; http://en.wikipedia.org/wiki/Same_origin_policy

并添加以下行

dataType: "jsonp",

你最后添加了逗号吗??