我还有一个问题:有没有办法使用 JavaScript 动态更改输入自动完成值？
示例:
<input id="myInput"
placeholder="Write something here..."
onchange="changeAutocompleteValue(event)">
<script>
function changeAutocompleteValue(event)
{
var list = ["first", "second", "third"];
event.list = list;
}
</script>
谷歌示例:
我可以用普通的 JS 来做吗？任何建议都会很棒:)。
最佳答案
我发现了
javascript : Auto complete javascript text field
如果使用现有库则
function loadXMLDoc(_target, _type,_func) {
var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 ) {
if(xmlhttp.status == 200){
data = JSON.parse(xmlhttp.responseText);
_func(data);
}
else if(xmlhttp.status == 400) {
alert('There was an error 400')
}
else {
alert('something else other than 200 was returned')
}
}
}
xmlhttp.open(_type, _target, true);
xmlhttp.send();
}
function ontxtChange(){
var dcc = document.getElementById('autocc');
var dc = document.getElementById('autoc');
dcc.innerHTML = ' ';
var i = 0;
var target = "https://api.github.com/users/mralexgray/repos"
//
if(dc.value.length > 0){
loadXMLDoc(target,'GET',function(data){
data.forEach(function(x){
if(i < 10){
if(x.name.toLowerCase().indexOf(dc.value.trim()) != -1){
dcc.innerHTML += '<p class="accItem">' + x.name.toLowerCase() + '</p>';
i++;
}
}
});
});
}
}.accItem{
background-color:#333;
color:#fff;
width:200px;
}
#autocc{
width:200px;
}<body>
<input type="text" id="autoc" onkeypress="ontxtChange()" > example : "am"
<div id="autocc">
</div>
</body>建议--
- 调用ajax的条件(大数据时速度慢)
- 使用ajax发送/接收数据的条件
希望能帮到你...
关于javascript - 更改输入自动完成值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28517062/