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

クロスドメイン呼び出しを簡単に行うことはできません。同一生成元ポリシーによって制限されています。ネットワークタブを確認してください。リクエストが失敗したことが示されているはずです。

また、入力フィールドの値も渡さなかった。このようにURLに追加する必要があります?q=hello。

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

他のドメインにアクセスするには、いわゆるJSONP呼び出しが必要です。

GoogleSearchAPIをご覧ください。

于 2012-07-03T15:49:07.980 に答える