如何將簡單的JQuery自動完成語法與對遠程數據源（PHP腳本）的Ajax調用結合起來？

Question

我有一個調用，查詢數據庫的PHP腳本，通過成果循環，將它們插入到一個數組一個有效的JQuery的自動完成腳本，那麼這個函數回聲數組json_encoded和自動完成的偉大工程：

例A：

$(function() { 
     var availableTags = <?php echo json_encode($names); ?>; 
     $("#Person").autocomplete({ 
      dataType: "json", 
      source: availableTags 
     }); 
    }); 

但是，通過這種方法，$ name中的所有名稱都可以在頁面源中看到。我有利用另一功能自動完成的腳本AJAX：

實施例B：

$("#Person").keyup(function(){ 
     $.ajax({ 
     type: "POST", 
     url: "PHPscript", 
     data:'keyword='+$(this).val(), 
     success: function(data){ 
      $("#Person-suggestion-box").show(); 
      $("#Person-suggestion-box").html(data); 
     } 
     }); 
    }); 

的差異，但是，是我必須手動樣式化與人建議箱和手代碼許多的複雜性的這些功能非常功能地捆綁到簡單的JQuery自動完成中。有沒有一種方法可以利用示例A的功能實例B（這樣我就可以獲得JQuery自動完成附帶的簡單CSS和功能，但是可以隱藏示例B的結果（源代碼中不可見）？ 。

Answer 1

如何呼應$names爲div元素，從該分區的所有內容複製到一個JavaScript變量，之後刪除div和從DOM（和源）及其所有的名稱裏面，

PHP：

<div class="names"><?php echo json_encode($names) ?></div> 

JS：

// copy names from the div 
var availableTags = $('div.names').html(); 

// remove div 
$('div.names').remove(); 

// add content to autocomplete 
$("#Person").autocomplete({ 
    dataType: "json", 
    source: availableTags 
}); 

編輯：

股利需要在一開始是空的。頁面加載完成後才能使用Ajax調用（類似於一個實例B）得到的名稱，然後將它們添加到<div class="names"></div>，

$('div.names').html(data); 

之後繼續按第一個建議，

// copy names from the div 
var availableTags = $('div.names').html(); 

// remove div 
$('div.names').remove(); 

// add content to autocomplete 
$("#Person").autocomplete({ 
    dataType: "json", 
    source: availableTags 
});