filter 筛选标签 · HkCms tp6版使用手册《免授权，永久商用》-02251406

# filter 筛选标签 - [filter 筛选标签](#filter__2) - [参数](#_5) - [使用注意](#_14) - [参数说明](#_26) - [字段调用](#_136) ## filter 筛选标签获取后台模型设定的筛选字段。常用于列表筛选 ## 参数参数名称可选值默认值是否必填说明id-$item-指定循环里的变量名，例如id='obj'，模板调用如：{$item.title} 变成 {$obj.title}currentstyle-active-指定选中的class样式multiple1/00-是否允许多选，1-开启多选，0-关闭field开启筛选的字段--限制显示筛选字段alltxt-全部-第一个选项显示的文字，例如：alltxt="不限"，等于off则不显示## 使用注意要使用筛选标签，请先在后台指定筛选的字段 ![](https://img.kancloud.cn/ec/e9/ece9d26b8287e8ed475e48687766ca16_1328x897.png) 如果你的字段类型非下拉列表、单选、复选，你需要指定选项类别。如下图 ![](https://img.kancloud.cn/4a/39/4a3910bd78ed6728a637f8671702b597_785x601.png) 效果图： ![](https://img.kancloud.cn/53/9a/539acbf7d2546e3bb12d79f0297bb8aa_505x126.png) ## 参数说明 `id`参数，用于指定循环的变量名，默认是`$item`，设置值`id="obj"`，变量名即为$obj。 ``` <pre class="calibre16">``` {hkcms:filter id="obj"} 选项名字：{$obj.title}: // 选项列表，使用volist循环标签循环输出。 {hkcms:volist name="obj.option" id="vo"} <a href="{$vo.url}" class="{$vo.currentstyle}">{$vo.title}</a> {/hkcms:volist} {/hkcms:filter} ``` ``` `currentstyle` 指定选择项的class，默认class名称为`active` ``` <pre class="calibre16">``` {hkcms:filter id="obj" currentstyle="newclass"} 选项名字：{$obj.title} {hkcms:volist name="obj.option" id="vo"} // currentstyle="newclass", 当该选项选中时，$vo.currentstyle的值为newclass，没选择的为空。 <a href="{$vo.url}" class="{$vo.currentstyle}">{$vo.title}</a> {/hkcms:volist} {/hkcms:filter} ``` ``` `multiple`参数开启多选，1=开启，0=关闭 ``` <pre class="calibre16">``` {hkcms:filter multiple="1" } <div class="pt-2 pb-2 d-flex mb-1 mt-1"> <div class="">{$item.title}: </div> <div class="filter"> <ul class="clearfix mb-0"> {hkcms:volist name="item.option" id="vo"} <li><a href="{$vo.url}" class="{$vo.currentstyle}">{$vo.title}</a></li> {/hkcms:volist} </ul> </div> </div> {/hkcms:filter} ``` ``` `field` 限定字段，当有时候不想显示所有筛选字段，在这里可以指定筛选的字段。多个字段使用英文逗号分隔。如下： ``` <pre class="calibre16">``` // 只显示option和option2的字段 {hkcms:filter field="option,option2" } <div class="pt-2 pb-2 d-flex mb-1 mt-1"> <div class="">{$item.title}: </div> <div class="filter"> <ul class="clearfix mb-0"> {hkcms:volist name="item.option" id="vo"} <li><a href="{$vo.url}" class="{$vo.currentstyle}">{$vo.title}</a></li> {/hkcms:volist} </ul> </div> </div> {/hkcms:filter} ``` ``` `alltxt`指定第一个重置选项的名称，例如通常有：全部、不限等，默认显示`全部`，如果不想显示等于`off`即可关闭 ``` <pre class="calibre16">``` {hkcms:filter alltxt="不限" } <div class="pt-2 pb-2 d-flex mb-1 mt-1"> <div class="">{$item.title}: </div> <div class="filter"> <ul class="clearfix mb-0"> {hkcms:volist name="item.option" id="vo"} <li><a href="{$vo.url}" class="{$vo.currentstyle}">{$vo.title}</a></li> {/hkcms:volist} </ul> </div> </div> {/hkcms:filter} ``` ``` 效果 ![](https://img.kancloud.cn/86/ba/86bab175108536f4a69959cf3960dc2e_314x101.png) 筛选文字多语言化，注意前提写好多语言。多语言配置可前往多语言章节了解。 ``` <pre class="calibre16">``` {hkcms:filter alltxt="lang('All')" } <div class="pt-2 pb-2 d-flex mb-1 mt-1"> // 多语言标题，格式为：{:__(这里写变量)} <div class="">{:__($item.title)}: </div> <div class="filter"> <ul class="clearfix mb-0"> {hkcms:volist name="item.option" id="vo"} <li><a href="{$vo.url}" class="{$vo.currentstyle}">{:__($vo.title)}</a></li> {/hkcms:volist} </ul> </div> </div> {/hkcms:filter} ``` ``` 关闭第一的重置选项 ``` <pre class="calibre16">``` {hkcms:filter alltxt="off" } <div class="pt-2 pb-2 d-flex mb-1 mt-1"> <div class="">{$item.title}: </div> <div class="filter"> <ul class="clearfix mb-0"> {hkcms:volist name="item.option" id="vo"} <li><a href="{$vo.url}" class="{$vo.currentstyle}">{$vo.title}</a></li> {/hkcms:volist} </ul> </div> </div> {/hkcms:filter} ``` ``` 效果 ![](https://img.kancloud.cn/7d/81/7d81c716138751bb63cb4c10cb43f68e_336x113.png) ## 字段调用更多字段可在模型管理》字段管理里面找到字段的名字，以下仅包含主要的字段 **注意：其中`$item`变量根据filter标签的id参数影响，默认是：$item。** 字段名说明调用方式title字段标题{$item.title}name字段名{$[item.name](http://item.name)}option数组，里面是筛选的选项,使用volist循环标签{hkcms:volist name="item.option" id="vo"} {/hkcms:volist}**option 内容，id="vo"** 字段名说明调用方式title标题{$vo.title}name选项值{$[vo.name](http://vo.name)}url链接地址{$vo.url}currentstyle高亮，选中的选项有class，用于css定义颜色高亮{$vo.currentstyle}