通過Ajax動態更新數據列表

我需要通過ajax更新html5數據列表。
Html代碼在這裏。通過Ajax動態更新數據列表

<body> 
    <input type="text" id="bar" list="fruit" onkeyup="jsfun()" /> 
    <datalist id="fruit"></datalist> 
</body>

JavaScript的僞代碼。

function jsfun(){ 
    //1- Get the last word from input field ("bar"). 
    var skw1 = document.getElementById("searchBar").value; 
    var skw2 = skw1.split(" "); 
    var skw = skw2[skw2.length-1]; 
    //2- Use Ajax to send data on server and get data result back 
    /* 
    * here goes other javascript content for ajax 
    */ 
    xmlhttp.open("GET","searchopt.php?skw="+skw,true); 
      xmlhttp.send(); 
    //3- use javascript to update the datalist with those result which Ajax get. 
}

在這裏看到下面的網址先寫莽然後將其刪除，並寫班恩
它給一個建議
然後將其刪除，並知道寫芒果班恩這個時候不能給出任何建議。但爲什麼建議在數據庫中出現，只給第一個字提供建議。
http://iws.uphero.com/qwe.html

來源

2013-04-17 Axeem

好的...這是問題所在。默認情況下，Datalist與允許的選項在文本框中的內容相匹配。選項ARE通過AJAX正確更改。不變的是，「芒果班恩」不等於「芒果」或「班恩」。

作爲一種解決方法，您可以在輸入第二個單詞後使用AJAX功能覆蓋文本框。例如：

var skw1 = document.getElementById("searchBar").value; 
var skw2 = skw1.split(" "); 
var skw = skw2[skw2.length-1]; 
document.getElementById("searchBar").value = skw;

來源

2013-04-17 13:45:31 Lawson

我不需要整件事情，只需要最後一個詞就像每個詞的谷歌建議。 – Axeem

它按預期爲我工作。我輸入「mango bann」，並返回「bann」。 – Lawson

是的，它返回「bann」，但問題是，它不能給這個建議。如果你只是寫「bann」，那麼它給出建議 – Axeem

通過Ajax動態更新數據列表

回答

相關問題