列表实现select下拉多选筛选功能呢

迅睿框架 更新 2025-11-04 08:08:26 小萌娃

微信截图_20220802095311

官网这个筛选复选字段 能不能改成 select 下拉多选完之后再加个搜索按钮呢,有大神指导下么。。

方案

  • 优速开发工作室 #1 · 2022-08-02 10:02:29
    道理都一样,只是改变了一种模板展示方式,用js就可以搞定了,可以加我QQ做
  • 小黄人 18html #2 · 2022-08-02 10:03:11
    百度找对应的样式就可以实现了
  • 小黄人 18html #3 · 2022-08-02 11:22:34
    满意答案
    官方默认模板改造
                                    <form action="/index.php" method="get">
                                        <input type="hidden" name="s" value="demo">
                                        <input type="hidden" name="c" value="search">
                                        <input type="text" placeholder="搜索内容..." name="keyword">
                                        <div class="form-group row" id="duoxuan">
                                            <label class="col-md-2 control-label">复选字段-多条件</label>
                                            <div class="col-md-9">
                                                <label>
                                                    <a class="label {if !$params.fuxuankuang}label-success{else}label-default{/if}" href="{Router::search_url($params, 'fuxuankuang', NULL)}">不限</a>
                                                </label>
                                                <!--调用单选字段数据方法-->
                                                {php $field = dr_field_options($ci->module['field']['fuxuankuang']['id']);}
                                                {loop $field $value $name}
                                                <label>
                                                    <span class="label {if dr_is_double_search($params.fuxuankuang, $value)}label-success{else}label-default{/if}" data-value="{$value}">{$name}</span>
                                                </label>
                                                {/loop}
                                            </div>
                                        </div>
                                        <input id="duoxuan_value" name="fuxuankuang" value="{$params.fuxuankuang}" type="hidden">
                                        <script type="text/javascript">
                                        $('#duoxuan span').on('click', function() {
                                            var val = $(this).data('value');
    
                                            //点击,添加样式
                                            if ($('#duoxuan a').hasClass('label-success')) {
                                                $('#duoxuan a').removeClass("label-success").addClass("label-default");
                                            }
                                            if ($(this).hasClass('label-success')) {
                                                $(this).removeClass("label-success").addClass("label-default");
                                            } else {
                                                $(this).removeClass("label-default").addClass("label-success");
                                            }
                                            //点击,添加样式
    
                                            //历遍,组合多选值
                                            var id = [];
                                            $("#duoxuan span").each(function() {
                                                if ($(this).hasClass('label-success')) {
                                                    id.push($(this).data('value'));
                                                }
                                                var Newstr = id.join("|");
                                                $('#duoxuan_value').val(Newstr);
                                            });
                                            //历遍,组合多选值
    
                                        })
                                        </script>
                                        <input type="submit" value="提交搜索" />
                                    </form>
  • 小萌娃 #4 · 2025-11-04 08:08:26
    @小黄人 18html:设置结贴下

迅睿系统漏洞

站群分站系统
站群分站系统(2026-10-15)
子站域名新增llms.txt访问
GEO系统
GEO系统(2026-10-14)
修复下载zip空白地址问题 修复流量复刻和任务队列错误
GeoSeo收录宝
GeoSeo收录宝(2026-10-14)
新增 站长工具箱 前端首页自动调用meta 数据
滑块验证码 Gocaptcha
滑块验证码 Gocaptcha(2026-10-13)
基于开源项目 go-captcha 的行为验证码插件,滑动拼图、区域...
GeoSeo工具箱
GeoSeo工具箱(2026-10-13)
优化巡检任务
GeoSeo排名助手
GeoSeo排名助手(2026-10-11)
加入大模型自定义
SEO聚合关键字
SEO聚合关键字(2026-10-11)
优化关键字列表页最多支持1万篇文章,过多会导致服务器扛不住;
CMS内容同步复制
CMS内容同步复制(2026-10-10)
增加时间是否更新的开关