烟雨江湖:表格数据筛器

本零件可以为表格列增加筛选功能。

注意：带有rowspan或colspan的表格可能导致筛选结果出错。

使用方法

1. 安装本零件，等待缓存刷新。
2. 为需要进行数据筛选的表格添加样式类filterable，然后在需要筛选的列头上添加样式类filterable-head。
3. 页面在显示表格时会在列头末尾加上浅色的  图标。
4. 点击图标即可打开筛选菜单。

相关说明

• 筛选器未生效时（没有输入任何筛选字段且筛选项目为全选状态）图标为灰色，生效时图标为黑色。
• 筛选字段与全体筛选项目之前为与关系（即只有同时符合这两种筛选条件的行才会保留）。筛选项目之间为或关系（即只要符合其中一个筛选项目的行就会保留）。
• 筛选的依据是单元格的内的文本内容（如果单元格中只有图片，那这个单元格很可能会被判定为空）。
• 筛选操作有0.5秒的缓冲间隔。也就是说，间隔不超过0.5秒的连续操作中只有最后一次的操作结果才会真正执行。这种设定也会让筛选有一个短暂的延迟。

示例

{| class="wikitable filterable"
! id
! class="filterable-head" | first_name
! last_name
! class="filterable-head" | gender
|-
|1||Jessalyn||Corstorphine||Female
|-
|2||Loutitia||Smallman||Female
|-
|3||Collin||Toland||Male
|-
|4||Huberto||Coxall||Male
|-
|5||Nixie||Schober||Female
|-
|6||Saba||Bradberry||Female
|-
|7||Dolores||Duffer||Female
|-
|8||Sinclare||Torregiani||Male
|-
|9||Darci||Atlee||Female
|-
|10||Lorry||Flavelle||Male
|}

上面的代码会产生下面的效果：

id	first_name	last_name	gender
1	Jessalyn	Corstorphine	Female
2	Loutitia	Smallman	Female
3	Collin	Toland	Male
4	Huberto	Coxall	Male
5	Nixie	Schober	Female
6	Saba	Bradberry	Female
7	Dolores	Duffer	Female
8	Sinclare	Torregiani	Male
9	Darci	Atlee	Female
10	Lorry	Flavelle	Male

移植模板

在管理的wiki下创建以下内容：

• MediaWiki:Gadget-Filterable.js
• MediaWiki:Gadget-Filterable.css

• 在管理的wiki下MediaWiki:Gadgets-definition页面中申明（需管理员权限）

  * Filterable [ResourceLoader|default] | Filterable.js | Filterable.css