如何从javascript调用url并从url获取响应到javascript?

时间:2012-05-30 10:36:24

标签: javascript ajax html5

我想通过一个参数从javascript调用url,然后url必须为该特定请求提供响应。

响应实际上是这样的:

{"success":true,
 "result":  {"token":"4fc5ef2bd77a3","serverTime":1338371883,"expireTime":1338372183}
}

如果我直接在浏览器中尝试这个网址,我可以轻松获得相同的响应。但是通过javascript它无法正常工作。

我发布了我的示例代码用于测试目的,但没有回复。

那么请帮我解释如何打电话并获得回复?

提前致谢。

<html>
    <head>
        <script type="text/javascript">
            function getResponse()
            {
                var uname=document.testform.uname.value;

                $.ajax({
                type: 'POST',
                url: 'http://192.168.2.113/crm/webservice.php?operation=getchallenge&username='+uname,
                data: {},
                dataType: 'json',
                success: function(data) 
                { alert('got here with data'); },
                error: function() { alert('something bad happened'); }
                });

            }
        </script>
        <title>Test</title>
    </head>
    <body>
        <form name="testform" method="post">
            <div id="main" border="5" style="width:100%; height:100%;">
                <div id="sub" style="width:50%; height:50%;align:center;">
                    Username:<input type="text" name="uname">
                    <input type="button" name="ok" value="submit" onclick="getResponse();">
                </div>
            </div>
        </form>
    </body>
</html>

4 个答案:

答案 0 :(得分:2)

gdoron说您忘记在代码中包含jQuery的一个原因。但主要的是你使用带有跨域名的ajax,那个问题。如果您在浏览器中键入网址,它将正常工作,因为它将直接从浏览器请求到网站。但你不能使用ajax来发送请求跨域。

如果您想从不同的网站获取数据,我建议您查看JSONP或ajax跨域。

答案 1 :(得分:1)

这可能会对您有所帮助:

<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>

</head>
<body>

<div id="div1" hidden="true"> </div>

<button>Get External Content</button>



<script>
    $("#div1").load('http://192.168.2.113/crm/webservice.php?operation=getchallenge&username='+uname);

    $(document).ready(function(){
        $("button").click(function(){
            var t=$("#div1").text();
            alert(t);

        });
    });

</script>
</body>
</html>

答案 2 :(得分:0)

你没有包含jQuery库......

将其添加到<head>的顶部:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

如果您检查控制台是否有错误,您会看到$未定义。

答案 3 :(得分:0)

传递给data函数的success参数包含您的回复,当您返回JSON时,可以轻松访问任何部分。

// (inside your ajax call)
success: function(data) {
    alert(data.result.token);
    alert(data.result.serverTime);
    alert(data.result.expireTime);
},