制作一个html表格。需要做成响应式。
表头为 序号,姓名,年龄。每一列需要 “排序和搜索” 两个功能
填写搜索后文字后只显示当前列的所有包含关键字的记录。搜索字段清空后显示所有记录。
当第一个搜索填写后再填写其他字段的搜索关键字时,第一个搜索自动清空。
不同字段的排序功能是,互相不做影响,即第一个字段排序后,第二个字段再排序时,将重置第一个字段的排序为默认升序,搜索功能也是这样。
不同字段的排序和搜索功能可以叠加,即在搜索出一些记录后,再点排序,需要在当前搜索记录内进行排序。
考点:
js table综合应用。
删除线格式
JS搜索筛选table列:
function onSearch(obj,cols) { //js函数开始
setTimeout(function() { //因为是即时查询,需要用setTimeout进行延迟,让值写入到input内,再读取
var storeId = document.getElementById('store'); //获取table的id标识
var rowsLength = storeId.rows.length; //表格总共有多少行
var key = obj.value; //获取输入框的值
var searchCol = cols; //要搜索的哪一列,这里是第一列,从0开始数起
for(var i = 1; i < rowsLength-2; i++) { //按表的行数进行循环,本例第一行是标题,所以i=1,从第二行开始筛选(从0数起)
var searchText = stor