2011-12-07 22 views
0

jQuery的搜索抓取來自第三方的PHP腳本自動完成字符串:的Jquery + PHP:舉例

<script> 
    $(function() { 
     var availableTags = [ 
      "ActionScript", 
      "AppleScript", 
      "Asp", 
      "BASIC", 
      "C", 
      "C++", 
      "Clojure", 
      "COBOL", 
      "ColdFusion", 
      "Erlang", 
      "Fortran", 
      "Groovy", 
      "Haskell", 
      "Java", 
      "JavaScript", 
      "Lisp", 
      "Perl", 
      "PHP", 
      "Python", 
      "Ruby", 
      "Scala", 
      "Scheme" 
     ]; 
     $("#tags").autocomplete({ 
      source: availableTags 
     }); 
    }); 
</script> 

<div class="demo"> 
    <div class="ui-widget"> 
     <label for="tags">Tags: </label> 
     <input id="tags" /> 
    </div> 
</div> 
<!-- End demo --> 

<div class="demo-description"> 
    <p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.</p> 
    <p>The datasource is a simple JavaScript array, provided to the widget using the source- option.</p> 
</div> 
<!-- End demo-description --> 

有基本符合自動完成內容的變量,這是偉大的,所有,但我需要的東西也許更復雜一點。而不是從var/xml/sql提供一個列表,我需要從第三方php腳本發出的回聲中獲取。

這個php腳本會根據查詢回顯相應的信息。即:用戶搜索customsearch.php?q =檸檬會迴響「菠蘿」。

有人可以幫助我嗎?

+0

請閱讀手冊http://docs.jquery.com/UI/Autocomplete – goat

回答

2

根據您的其他question,我假設您正在進行AJAX調用以獲取搜索結果。它們加載到一個數組中,並在你的榜樣替換:

<script> 
function GetSearchResults(){ 
    // make your ajax call here 
    $.ajax({ 
     async: false, 
     url: 'customsearch.php?q=Lemons', 
     success: function(data) { 
     var availableTags = []; 
     // build an array from the response data here 
     $("#tags").autocomplete({ 
      source: availableTags 
     }); 
     } 
    }); 
} 

$(function() { 
    var availableTags = GetSearchResults(); 
}); 
</script> 

<div class="demo"> 

<div class="ui-widget"> 
<label for="tags">Tags: </label> 
<input id="tags" /> 
</div> 

</div><!-- End demo --> 

<div class="demo-description"> 
<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions  are tags for programming languages, give "ja" (for Java or JavaScript) a try.</p> 
<p>The datasource is a simple JavaScript array, provided to the widget using the source- option.</p> 
</div><!-- End demo-description --> 

理想情況下,你不會異步設置爲false,但我儘量不使你的大腦爆炸,如果你不熟悉的回調。

+0

你已經在代碼中做了一個異步回調...更不用說如果你只是把所有的東西放在ajax中回調而不是使用DOMReady回調。大聲笑:) – Esailija

+0

其實Esalija,你錯了。 Sara或任何其他開發人員可能不希望在DOM準備就緒之前運行它,因爲它們可能正在構建DOM中的信息所傳遞的數據。你所暗示的可能是不安全的。我不會推薦它。 –