autocomplete.js

最新推荐文章于 2024-06-06 09:43:25 发布

什么都不能

最新推荐文章于 2024-06-06 09:43:25 发布

阅读量1.7k

点赞数

分类专栏： javascript 文章标签： autocomplete function null table object input

本文链接：https://blog.csdn.net/hanpoyangtitan/article/details/4142687

版权

这是一个关于如何使用javascript实现自动补全功能的代码示例。通过AutoComplete函数，可以为输入框添加自动补全功能，根据用户输入的内容动态过滤数据，并显示匹配项。示例中展示了如何处理数据、创建补全面板、根据用户按键行为进行操作等核心功能。

摘要由CSDN通过智能技术生成

<html>
<head>
  <script>
/**
* autocomplete ??
* ?????IE 6
* @param textField            ????
* @param valueField           ???
* @param data                 ????
* @param showField            ??????????????key
* @param comparedField        ??????????????key
* @param comparedValueField   ????????????key
* @param filterField          ????????????key
* @param filterValue          ??????
* @return
* @author ex-hantao001
*/
function AutoComplete(textField, valueField, data, showField, comparedField, comparedValueField, filterField, filterValue){
    this.textField = typeof(textField) == "object"?textField:document.getElementById(textField);
    this.valueField = typeof(valueField) == "object"?valueField:document.getElementById(valueField);
    this.tempData = null;
    this.dataPanel = null;
    this.data = data;
    this.filterField = filterField;
    this.tilterValue = filterValue;
    this.showField = showField;
    this.comparedField = comparedField;
    this.comparedValueField = comparedValueField;
    this.selectedIndex = -1;
    this.init();
}
/**
*???
*/
AutoComplete.prototype.init = function(){
this.selectedIndex = -1;
    if(this.textField == null || this.data == null){
     return;
}
if(this.filterField != null)this.data = this.filter(this.data, this.filterField, this.filterValue);
this.createPanel();
    var autoComplete = this;
    autoComplete.compare(this.comparedField, this.comparedValueField);

    this.textField.onkeyup = function(){
        autoComplete.compare(autoComplete.comparedField, autoComplete.comparedValueField);
         //up 38 down 40
        if(event.keyCode == 40){
        var table = document.getElementById("container");
        if(autoComplete.selectedIndex+1 < table.rows.length){
          autoComplete.selectedIndex++;
          table.rows[autoComplete.selectedIndex].cells[0].style.