曹え 5811 发布于:2023-09-27 02:41:01
多个自定义字段筛选,下面的这个例子是职位筛选
包含了,部门、职位、城市 3个 字段
后台创建3个单选字段
html
<ul class="ul-listsel fix"> <li> <div class="con1"> <div class="sel"> {screen molds="article" orderby="orders desc" as="s"} {if($s['fieldname']=='部门')} <select name="" id=""> <option data-url="all" value="001">全部</option> {foreach $s['list'] as $ss} {if(isset($filters[$s['field']]) && strpos(','.$filters[$s['field']].',',','.$ss['key'].',')!==false)} <option selected data-url="{$ss['url']}" value="{$ss['key']}">{$ss['value']}</option> {else} <option data-url="{$ss['url']}" value="{$ss['key']}">{$ss['value']}</option> {/if} {/foreach} </select> {/if} {/screen} </div> </div> </li> <li> <div class="con1"> <div class="sel"> {screen molds="article" orderby="orders desc" as="s"} {if($s['fieldname']=='职位')} <select name="" id=""> <option data-url="all" value="002">全部</option> {foreach $s['list'] as $ss} {if(isset($filters[$s['field']]) && strpos(','.$filters[$s['field']].',',','.$ss['key'].',')!==false)} <option selected data-url="{$ss['url']}" value="{$ss['key']}">{$ss['value']}</option> {else} <option data-url="{$ss['url']}" value="{$ss['key']}">{$ss['value']}</option> {/if} {/foreach} </select> {/if} {/screen} </div> </div> </li> <li> <div class="con1"> <div class="sel"> {screen molds="article" orderby="orders desc" as="s"} {if($s['fieldname']=='位置')} <select name="" id=""> <option data-url="all" value="003">全部</option> {foreach $s['list'] as $ss} {if(isset($filters[$s['field']]) && strpos(','.$filters[$s['field']].',',','.$ss['key'].',')!==false)} <option selected data-url="{$ss['url']}" value="{$ss['key']}">{$ss['value']}</option> {else} <option data-url="{$ss['url']}" value="{$ss['key']}">{$ss['value']}</option> {/if} {/foreach} </select> {/if} {/screen} </div> </div> </li> </ul>
js
<script> // 筛选地址栏,修改栏目值为0(全部) function allselect(loc,opt){ let startIndex = loc.indexOf(opt); let len = opt; let result = parseInt(loc.substring(startIndex+len.length, startIndex+len.length+4)); let newStr = loc.replace(len+result, len+"0"); window.location.href ="/"+newStr; return false; } // 更改 表单标题 - 简介 $('.ul-listsel .con1 select').change(function(e){ var selectopt = $(this).find('option:selected'); var dataUrl = selectopt.attr('data-url'); if(dataUrl == 'all'){ let loc = window.location.pathname; let loc2 = window.location var str = loc.replace(/\//g, ""); if(selectopt.val()=='001'){ // 筛选部门 值为0 allselect(str,"-bumen-") return false; } if(selectopt.val()=='002'){ // 筛选职位 值为0 allselect(str,"-zhiwei-") return false; } if(selectopt.val()=='003'){ // 筛选位置 值为0 allselect(str,"-weizhi-") return false; } return false; } if (dataUrl) { window.location.href = dataUrl; } }) </script>
登录后可以留言提问!
微信扫码登录