0

http://jsfiddle.net/jensbits/PekQZ/からオートコンプリート検索を 試みましたが、サーバーからスクリプトを実行しようとすると、機能しません。ソースをコピーして、ホスティング サーバーの新しいページに貼り付けます。何かアドバイスはありますか？

<!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>
4

1 に答える 1

0

コピーしたコードは、サーバーの /echo/xml/ にリクエストを送信しようとしています (そして失敗しています)。この URL は JSFiddle の特別な機能です。詳細については、 http://doc.jsfiddle.net/use/echo.htmlを参照してください。

于 2013-10-02T05:45:34.593 に答える