1

我需要通过 ajax 更新一个 html 5 数据列表。
html代码在这里。

<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.
}

在这里看到下面的网址首先写mang然后删除它并写bann
它给出一个建议
然后删除它并知道写mango bann这次它不能给出任何建议。为什么但是这个建议存在于数据库中。它只给第一个建议单词。
http://iws.uphero.com/qwe.html

4

1 回答 1

0

好的...这是问题所在。默认情况下,Datalist 将文本框中的内容与允许的选项相匹配。选项正在通过 AJAX 正确更改。没有改变的是“mango bann”不等于“mango”或“bann”。

作为一种解决方法,您可以使用 AJAX 函数在输入第二个单词后覆盖文本框。例如:

var skw1 = document.getElementById("searchBar").value;
var skw2 = skw1.split(" ");
var skw = skw2[skw2.length-1];
document.getElementById("searchBar").value = skw;
于 2013-04-17T13:45:31.447 回答