响应正常，但 $.ajax 上的成功方法未触发？

Question

        $("#btnSubmit").click(function () {
            var fields = $("#testform").serializeObject();
            var response = "Nista";
            JSONstring = JSON.stringify(fields);
            alert(JSONstring);

            $.ajax({
                type: "GET", 
                url: "http://localhost/testSimple.php?symbol=IBM&jsonpCallback=?",
                // url: "http://localhost/testSimple.php?json=" + JSONstring,
                dataType: "jsonp", 

                success: function (msg) {
                    alert("SUCCESS");
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(textStatus);
                }
            });

在 html:

<div id="dynamicContent" class="dynamicContent">
            <form id="testform" method="post">
            <div class="fm-req">
                <h2>
                    The Form:</h2>
            </div>
            <!--<input type="text" name="message" id="Text1" name="Fieldname22" />-->
            </form>
            <div class="fm-add">
                <input id="btnSubmit" type="button" value="Submit" />
            </div>
        </div>

和 firebug 中的 php 脚本

<?php
$person = array(
        'name'    => 'Quentin',
        'country' => 'Australia'
    );

    header('Content-type: application/json');

    echo json_encode($person);
?>

中都可以，但成功但没有捕获响应.. 为什么？

Answer 1

尝试将您的 PHP 脚本更改为：

<?php
$jsonpCallback = $_GET['jsonpCallback'];
$person = array(
        'name'    => 'Quentin',
        'country' => 'Australia'
    );

    header('Content-type: application/json');

    echo $jsonpCallback.'('.json_encode($person).')';
?>

更新评论中的问题：

您的 JavaScript 应该如下所示：

$("#btnSubmit").click(function () {
    var fields = $("#testform").serialize();
    $.ajax({
        type: "GET", 
        url: "http://localhost/testSimple.php?"+fields+"&jsonpCallback=?",
        dataType: "jsonp", 

        success: function (msg) {
            alert("SUCCESS");
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert(textStatus);
        }
    });
});

Answer 2

请记住 jsonp 在本地主机上不起作用！

但是：

你必须将这些行添加到你的 php 代码中；

header("access-control-allow-origin: *");
header('content-type: application/json; ');  

在 localhost 模式下将您的 dataType 更改为此：

dataType:'json'

并在您的 ajax 请求上执行以下操作来测试结果：

    success: function(data, success) {
      console.log("success", arguments);
      console.log("data", typeof data, data); // Verify the response
    },
    error: function(jqxhr, textStatus, error) { 
      console.log("error", arguments);
    },
    complete: function(jqxhr, textStatus) {
      console.log("complete", arguments);
    }

Answer 3

您需要将数据类型更改为 json

dataType: "json",

如果您想使用回调，请这样做这里

$.ajax({
  dataType: 'jsonp',
  data: 'id=10',
  jsonp: 'jsonp_callback',
  url: 'http://myotherserver.com/getdata',

  success: function () {
    // do stuff
  },
});

我找到了一篇关于 jsonp 的好文章
http://remysharp.com/2007/10/08/what-is- jsonp/