Question

我正在尝试创建一个过滤网格的功能。为此，我使用带有onkeyup事件的输入类型文本Filter（）

@Entity
@Table(name="Data")
public class Data { 
@Id
@GeneratedValue
@Column(name="id")
private Long id;
@Column(name="name")
private String name;
@Column(name="description")
private String description;
@Column(name="priority")
private int priority;
}

@Entity
@Table(name="Employee")
public class Employee {
@Id
@GeneratedValue
@Column(name="id")
private Long id;
@Column(name="firstName")
private String firstName;
@Column(name="lastName")
private String lastName;
@Column(name="position")
private String position;
}

JS：

  <label>Filter:</label><input type="text" id="filterTextBox" onkeyup="Filter()" style="margin-left: 5px;  border: 1px solid #cccccc; border-radius: 4px;"/>

我一直在尝试调试但老实说，我不知道为什么会收到错误：

function Filter() {
    // Declare variables 
    var input, filter, table, tr, column, td, i;
    input = document.getElementById("filterTextBox");
    filter = input.value.toUpperCase();
    table = document.getElementsByClassName("table");
    tr = table.getElementsByTagName("tr");
    // column = Document.getElementsByClassName("td-tc");

    for (i = 0; i < tr.length; i++) {
        td = tr[i].getElementsByClassName("td-tc")[0];
        if (td) {
            if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
                tr[i].style.display = "";
            } else {
                tr[i].style.display = "none";
            }
        }
    }
}

我在这里想念什么？

我曾试图谷歌上的错误，但我不知道可能出现什么问题。

Answer 1

您试图在元素集合上找到TR，而不是单个元素。

首先正确定义table变量。

table = document.getElementsByClassName("table")[0];

比tr定义应该没问题。

tr = table.getElementsByTagName("tr");

过滤网格：getElementsByTagName不是函数

1 个答案: