1

我正在练习编写 jQuery 和 Ajax 代码并制作一个普通的 Google 搜索框，但它不起作用。没有控制台错误，Chrome 中的调试也无济于事。这是代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<script type="text/javascript"
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">

</script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#button").click(function() {
            $.ajax({
                url : "http://www.google.com/search",
                dataType : "html",
                success : function(data) {
                    $("#show").html(data)
                },
                fail : function() {
                    alert("failed lol")
                }
            })
        })
    })
</script>
</head>
<body>
    <div id="search">
        <form name="input" method="get">
            Google it: <input type="text" name="googleit" /> <br /> <br /> <input
                id="button" type="button" value="let me google that for you" />
        </form>
    </div>
    <div id="show"></div>
</body>
</html>

这段代码有什么问题？

4

1 回答 1

2

您不能那么容易地进行跨域调用，它受Same Origin Policy的限制。检查您的网络选项卡，它应该说明请求失败。

此外，您甚至没有交出输入字段的值。您应该像这样将它附加到 url ?q=hello。

        $.ajax({
            url : "http://www.google.com/search?q=" + $("input").val(),
            dataType : "html",

您需要一个所谓的JSONP 调用来访问其他域。

看看Google 搜索 API。

于 2012-07-03T15:49:07.980 回答