2013-10-02 64 views
0

我试图从http://jsfiddle.net/jensbits/PekQZ/ 自动完成搜索,但是当我试图从我的服务器运行脚本,它不工作。 我复制粘贴源到我的托管服务器中的新页面。任何建议最新错误?AJAX自动完成不工作

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title>jquery autocomplete xml search from beginning - jsFiddle demo</title> 

    <script type='text/javascript' src='http://code.jquery.com/jquery-1.6.3.js'></script> 



    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script> 


    <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 


     <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/start/jquery-ui.css"> 



    <style type='text/css'> 
    .red {color: red} 
    </style> 



<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){ 
//for fiddle demo xml had to be loaded in this way 
//use your own ajax call for your page 
$.ajax({ 
    url: "/echo/xml/", //your url 
    type: "POST", //may not need this-fiddle did-default is GET 
    dataType: "xml", 
    data: { 
     xml: "<geonames><geoname><name>London</name><geonameId>2643743</geonameId><countryCode>GB</countryCode><countryName>United Kingdom</countryName></geoname><geoname><name>London</name><geonameId>6058560</geonameId><countryCode>CA</countryCode><countryName>Canada</countryName></geoname><geoname><name>The Tower of London</name><geonameId>6286786</geonameId><countryCode>GB</countryCode><countryName>United Kingdom</countryName></geoname></geonames>" 
    }, //should not need to define 'data' on your own xml call 
    success: function(xmlResponse) { 
     var data = $("geoname", xmlResponse).map(function() { 
      return { 
       value: $("name", this).text() + ", " + ($.trim($("countryName", this).text()) || "(unknown country)"), 
       id: $("geonameId", this).text() 
      }; 
     }).get(); 
     $("#test").autocomplete({ 
      source: function(req, response) { 
       var re = $.ui.autocomplete.escapeRegex(req.term); 
       var matcher = new RegExp("^" + re, "i"); 
       response($.grep(data, function(item) { 
        return matcher.test(item.value); 
       })); 
      }, 
      minLength: 2, 
      select: function(event, ui) { 
       $("p#result").html(ui.item ? ui.item.id : "Nothing selected, input was " + this.value); 
      } 
     }); 
    } 
}); 
});//]]> 

</script> 


</head> 
<body> 
    <h1>jQuery Autocomplete XML Source Search from Beginning</h2> 
<p class="ui-widget">Try typing 'Lo' it will match on 'London'. <br />Try typing 'don', no matches.<br />Try typing 'the', matches 'The Tower of London'. You get the idea.</p> 

<div class="ui-widget"> 
    <label for="test">London matches: </label> 
    <input id="test" /> 
</div> 

<p id="result" class="ui-widget red"></p> 


</body> 


</html> 

回答

0

您复制的代码尝试(和失败)向服务器上的/ echo/xml /发出请求。该URL是JSFiddle的一个特殊功能。有关更多详细信息,请参阅http://doc.jsfiddle.net/use/echo.html

+0

任何方式来修改脚本,以便它将在托管服务器上工作? – user2822230