2011-10-27 14 views
0

次のコードが機能しないのはなぜですか? (リモートソースをローカルに変更すると、正常に動作します)jQuery UIを使用した簡単なリモートデータ自動完成?

<!DOCTYPE html> 
<html> 
<head> 
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
    <script> 
    $(document).ready(function() { 
    $("input#autocomplete").autocomplete({ 
     source: "http://jqueryui.com/demos/autocomplete/search.php", 
      minLength: 2, 
      select: function(event, ui) { 
      } 

    }); 
    }); 
    </script> 
    <style> 
    .ui-autocomplete-loading { background: white url('http://jqueryui.com/demos/autocomplete/images/ui-anim_basic_16x16.gif') right center no-repeat; } 
    </style> 
</head> 
<body style="font-size:62.5%;"> 

<input id="autocomplete" /> 

</body> 
</html> 

答えて

1

ソースと同じオリジンポリシーでは、別のサイトのスクリプトを実行する必要があります。

http://en.wikipedia.org/wiki/Same_origin_policy

あなたはJSONPを返すことができます別のサイトにjQueryのAJAX呼び出しを使用するようにソースを変更することができます。

は、例えば、これを参照してください。http://jqueryui.com/demos/autocomplete/#remote-jsonp

またはソースURL与えられたリターンがJSONPことを確認してください。

関連する問題