jquery实现静态搜索功能(可输入搜索文字)

代码如下	复制代码
.navbar-collapse { padding: 0; } .alert { margin: 20px; } .input-group select.form-control:last-child { border-top-left-radius: 4px; border-bottom-left-radius: 4px; margin-right: -1px; } .tab-content{ padding-top: 20px; } 克利夫兰 骑士 金州 勇士 波士顿 凯尔特人 休斯顿 火箭 搜索结果tab隐藏 全部 姓名 位置 介绍 搜索
号码	姓名	位置	身高	体重	介绍
23	勒布朗-詹姆斯	小前锋	203CM	113KG	四届NBA最有价值球员奖
2	凯尔-欧文	控球后卫	191CM	88KG	15-16赛季NBA总冠军
0	凯文-乐福	大前锋/中锋	208CM	110KG	15-16赛季获得NBA总冠军
13	特里斯坦-汤普森	大前锋	206CM	103KG	擅长拼抢进攻篮板球
5	J.R.史密斯	得分后卫	198CM	102KG	15-16赛季NBA总冠军

号码

姓名

位置

身高

体重

介绍

30

斯蒂芬-库里

控球后卫

191CM

83.9KG

两届NBA最有价值球员奖 三分精准

11

克莱-汤普森

得分后卫

201CM

93KG

14-15赛季NBA总冠军

35

凯文-杜兰特

小前锋/大前锋

211CM

106.6KG

得分手段多样投篮精准

23

德雷蒙德-格林

前锋

201CM

104KG

顶级锋线防守者

9

安德鲁-伊格达拉

得分后卫

198CM

94KG

迷你版勒布朗身体素质极佳

号码

姓名

位置

身高

体重

介绍

4

以赛亚-托马斯

控球后卫

175CM

84KG

球风强硬 能够突破 具备三分射程

0

埃弗里-布拉德利

控球后卫

188CM

82KG

15-16赛季最佳防守阵容第一阵容

42

艾尔-霍福德

中锋

208CM

111KG

球风全面的内线 中距离精准

9

贾伊-克劳德

大前锋

198CM

107KG

能量四射的双能锋

36

马库斯-斯玛特

控球后卫

193CM

100KG

敢于突破不惧身体对抗球风无私

号码

姓名

位置

身高

体重

介绍

13

詹姆斯-哈登

后卫

196CM

99.8KG

两次入选NBA最佳阵容第一阵容

1

特雷沃-阿里扎

小前锋

203CM

95.3KG

08-09赛季NBA总冠军

2

帕特里克-贝弗利

控球后卫

185CM

84KG

2015年全明星技巧挑战赛冠军

10

埃里克-戈登

得分后卫

191CM

100.7KG

属于攻击型得分后卫

3

莱恩-安德森

大前锋

208CM

109KG

投篮型内线出手快

搜索结果

号码

姓名

位置

身高

体重

介绍

信息摘自互联网内容 若有冒犯请原谅 请留言反馈 立即删除

$('#myTabs a').click(function(e) {

e.preventDefault()

$(this).tab('show')

})

$('#searchText').change(function() {

console.log("dd");

var searchText = $(this).val();

var searchSelect = $('#searchSelect').val();

var $searchTr = "";

if(searchText != "") {

$('#search tbody').html("");

//筛选搜索

if(searchSelect == "name") {

$searchTr = $('#myTabContent').find('td:nth-child(2):contains(' + searchText + ')').parent();

} else if(searchSelect == "position") {

$searchTr = $('#myTabContent').find('td:nth-child(3):contains(' + searchText + ')').parent();

} else if(searchSelect == "about") {

$searchTr = $('#myTabContent').find('td:nth-child(6):contains(' + searchText + ')').parent();

} else {

$searchTr = $('#myTabContent').find('td:contains(' + searchText + ')').parent();

}

$searchTr.each(function(i, e) {

$('#search tbody').append($(e).clone(true));

});

//如果没有搜索结果 显示一个报错div

if($searchTr.length

$('#search tbody').html('没有内容')

}

$('#search-tab').tab('show');

}

}).keyup(function() {

$(this).change();

})

$('#searchBth').click(function() {

$('#searchText').change();

})