2

我很确定这有一个我缺少的简单解决方案。我有以下 ajax 脚本。

<!DOCTYPE html>
<html>
<head>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
function postForm() {
    var ret = $('#test').val();
    $.ajax({
            type: 'POST',
            url: 'http://10.0.0.8:9000/demo',
            data: '{"name" : '+ret'}',
            contentType: "application/json; charset=utf-8",

        })
    }

</script>
</head>
<body>
    <form id="ajaxForm" onSubmit="postForm(); return false;"  method="post"> 
        <input id="test" type="text" name="name" value="Hello JSON" /> 
        <input type="submit" value="Submit JSON" /> 
    </form>

</body>
</html>

我已经使用 id='test' 提取了输入的值，并将其放入 ret 变量中。然后我试图将它插入数据属性并通过ajax发送。我尝试了各种报价，但似乎没有任何效果....我做错了什么？

提前谢谢

4

1 回答 1

3

您似乎为您的 AJAX 脚本指定了一个绝对网址：

http://10.0.0.8:9000/demo

您似乎违反了same origin policy浏览器内置的规则，这会阻止您发送跨域 AJAX 调用。

因此，除非此 HTML 页面托管在http://10.0.0.8:9000.

此外，您似乎有一个,导致无效 javascript 的尾随。我还将使用该JSON.stringify方法将请求正确序列化为 JSON：

function postForm() {
    var ret = $('#test').val();
    $.ajax({
        type: 'POST',
        url: '/demo',
        data: JSON.stringify({ name: ret }),
        contentType: 'application/json; charset=utf-8',
        success: function(result) {
            // do something iwth the result of the AJAX call here
        }
    });
}

请注意我在这里如何使用相对路径 ( url: '/demo') 来确保不违反同源策略并确保将 AJAX 请求发送到同一个域。

另一方面，如果您需要发送跨域 AJAX 调用，那么您有几种可能性，包括使用JSONP（仅限于 GET 请求）或CORS两者都涉及对服务器端 API 的修改。如果您无法控制服务器端 API 并且无法对其进行修改，则必须在您的域（托管包含此 javascript 的 HTML 页面的那个）上编写一个服务器端脚本，该脚本将充当您的域之间的桥梁/代理和远程域，然后将 AJAX 请求发送到您的服务器端脚本。

于 2013-03-17T12:58:08.953 回答