bootstrap怎么在移动端横向布局_移动端筛选中的「不限」到底该怎么用

移动端筛选再常见不过了——

我们在租房时，对于户型、朝向都要要求时会用到多项筛选；我们在找工作时，对薪资和工作经验也会做多项筛选的限制

下图所示的就是比较常见的移动端多项筛选样式：

那么在工作中的你，在做下拉筛选时，是否对多项筛选进行过思考呢？

问：

1、为什么多选时需要重置和确认，单选时则不需要？2、为什么有的筛选项中有不限，而有的筛选项中又没有？不限到底有什么作用呢？

答：

针对问题1，比较容易理解：即因为多选时，是用户去选择多个选项进行筛选，我们无法得知用户是在选择了多少个选项后想进行筛选操作，所以给一个确认按钮，来确定用户已经选择好筛选项。针对重置按钮也比较好理解，因为如果择的筛选项太多，想要回到初始值时，最快捷的方式就是重置。

针对问题2，为什么有的筛选项中有不限，而有的筛选项中又没有？不限到底有什么作用呢？

可以看到自如的户型选择是多选项，出现了不限这个选项，当选择不限时，会清空掉已选的其他户型内的选择

而拉勾期望薪资是单选项，也出现了不限这个选项，当选择不限时，会清空掉已选的选择

所以，这个时候你肯定疑惑了：不限既用在了多项选择也用在了单项选择上？

——

解决问题从问题本身出发，我们可以先思考一下，为什么会出现不限这个选项？

肯定是因为你给了用户很多个选项，但是用户觉得这些选项都可以选，所以用户在这时候选择了不限。

还有一种情况是用户在选择了几个选项后，觉得还是恢复默认态比较好，所以用户选择了不限。

所以选了不限的用户其实分为AB两类：

A类用户希望有个选项选了可以包括你所给的所有选项（有点像全选）

B类用户希望回到默认状态，即什么都不选

所以

——

不限选项在这里有两个作用：

1、清空已选选项恢复默认态2、选择给出的所有选项

结论：

建议不限还是用在多项选择中，因为不限的作用是：

1、清空已选选项恢复默认态 2、选择给出的所有选项。

如果是单项选择，清空选项的成本较低，只需要再点击一下已选选项就可以了，完全不需要不限这个选项。

如果是单项选择又给一个不限选项是希望去选择所有选项，那这个类别本本就不该做成单项选择。

本文仅个人观点，欢迎大家来讨论各自的思考和见解，促进彼此共同进步~

bootstrap怎么在移动端横向布局_移动端筛选中的「不限」到底该怎么用相关推荐

移动端范围筛选html,移动端多项筛选中的「不限选项」，到底该怎么用？
释放双眼,带上耳机,听听看~! 移动端多项筛选中的不限选项到底该怎么用? 移动端筛选再常见不过了-- 我们在租房时,对于户型.朝向都要要求时会用到多项筛选:我们在找工作时,对薪资和工作经验也会做多项筛 ...
bootstrap怎么在移动端横向布局_前端知道分享，移动端布局
一.下面我将简单的介绍移动端布局的八种方式: 1.固定布局 2.流动布局 3.浮动布局 4.定位布局 5.混合布局 6.flex布局 7.rem布局 8.响应式布局 9.**圣杯布局10.**双飞翼 ...
【移动端网页布局】移动端网页布局基础概念 ⑧ ( 移动端页面布局方案 | 单独制作的移动端页面 - 主流 | 响应式页面兼容移动端 - 开发难度较大 )
文章目录一.移动端页面布局方案 1.单独制作的移动端页面 2.响应式页面兼容移动端一.移动端页面布局方案移动端页面方案 : 单独制作的移动端页面 : 主流开发方案 , PC 端与移动端访问 ...
操作无法完成因为已经在mysqld.exe上打开_三星的电脑、手机「二合一」体验，如何在国行设备上体验到？...
三星在刚结束没多久的 Galaxy Unpacked August 2020 发布会上为大家带来了 5 款硬件设备,拳头产品称不上出色,不算主角的「Galaxy Ecosystem」倒是惊喜连连. 除 ...
js移动端调试控制台_移动端js调试工具：eruda
通常写前端页面都在Chrome浏览器的开发模式下进行调试,但是写放在移动端的H5页面时,有时候会遇到在Chrome上调试没有问题,但是在手机的浏览器上有问题的情况:或者有些功能只能在特定的容器中才能其 ...
【移动端网页布局】移动端网页布局基础概念 ② ( 视口 | 布局视口 | 视觉视口 | 理想视口 )
文章目录一.视口 1.布局视口 ( 网页大小 | 网页大小 > 设备大小 ) 2.视觉视口 ( 设备大小 | 网页大小 > 设备大小 ) 3.理想视口 ( 网页大小 = 设备大小 ) 一 ...
【移动端网页布局】移动端网页布局基础概念 ① ( 移动端浏览器 | 移动端屏幕分辨率 | 移动端网页调试方法 )
文章目录一.移动端浏览器二.移动端屏幕分辨率三.移动端网页调试方法一.移动端浏览器移动端浏览器比 PC 端浏览器发展要晚 , 使用的技术比较新 , 对 HTML5 + CSS3 支持较好 ...
【移动端网页布局】移动端网页布局基础概念 ⑤ ( 视网膜屏技术 | 二倍图概念 | 代码示例 )
文章目录一.视网膜屏技术二.二倍图概念三.代码示例一.视网膜屏技术 PC 端和早期的移动端网页中 , CSS 中配置的 1 像素对应的就是物理屏幕中的 1 像素 ; Retina 视 ...
flex 左右布局_移动端开发常用布局：前端弹性布局总结
各位已经入坑的前端小伙伴,前面咱们已经给大家分享了移动端开发时候流式布局的应用场景及注意事项,今天再次给大家分享一个布局叫弹性布局,接下来咱们从如下几个方面,全方位的给大家介绍弹性布局的使用. 一:什 ...

bootstrap怎么在移动端横向布局_移动端筛选中的「不限」到底该怎么用

bootstrap怎么在移动端横向布局_移动端筛选中的「不限」到底该怎么用相关推荐

最新文章

热门文章