网页设计之非输入型字段自审单

　　非输入型字段这里指的是无需用户自己填写，通过规则列出由用户选择的字段。有时候，输入型字段与非输入型字段会有一些共性的审查项目，比如说数据类型以及是否可以通过其他字段计算出来等，但由于非输入字段更多可控，所以相对来说会有更多的限制，同时所需要考虑的情况也都会在自己的掌控之内。非填写字段这里介绍两种，一种是选择项，一种是时间日期选择器。设计选择项的时候，我们需要考虑的问题有以下几种：

　　1、此选择项的展示形式：下拉框、级联下拉框、一级弹窗、多级弹窗

　　对于设计选择项类型的非输入型字段来说，可以通过其具体业务大致分为下拉框、级联下拉框、一级弹窗、多级弹窗。一级与多级(级联)的区别即为是否有层级关系，这点比较容易理解。所以在我们设计的时候所需要考虑的是采用下拉框的形式还是采用弹窗的形式。

　　采用下拉框的形式时每一级的数据条目会比较少，以我的经验来说一般不要多于 20 条，如果再多的时候，不仅交互上并不友好，而且在请求后台数据的时候，返回的也会很慢。

　　所以这个时候我们就需要采用弹窗的形式，通过分页来控制其长度了。相当于牺牲了操作的便捷性来进行交互的优化，同时也减轻服务器压力。当然，在设计的时候我们也可以直接在下拉框上进行分页请求，这样的设计并不少见。最终怎么设计就看设计者自己的权衡了。

　　2、是否支持搜索选择项

　　在设计选择项的时候，是否允许搜索又是一个功能点，一般只要数据过多不好进行筛选的时候都会用到搜索。这样我们可以精准的定位到自己所要选择的项目。设计搜索时，我们需要考虑的是搜索是精准搜索还是模糊搜索。

　　当然，更友好的方式肯定是进行模糊搜索，然后通过模糊程度的不断精细其结果也越发精准。但是有时候，我们所需要填写的项目可能是在知道了此项的具体内容后进行填写的。比如设计审批单时，选择审批人的姓名肯定是确定的，这时我们就不妨使用精准搜索来提高检索速度。

　　3、选择项是否可以重复选择

　　关于这一点，我们在设计的时候也是需要的，比如在电商系统中的报备满仓预警时，已经是满仓的仓库(即已经被选择过的)肯定是不可以再继续选择的，这种情况就是不可以重复选择。是否可以重复选择这个设计点在业务逻辑上感觉还是比较明确的，如果自己业务理的清楚，可以很清楚地设计出来。

　　这里，我要说一个容易被遗忘的设计点：在设计已选择的某个元素不可被其他表单选择时，在已有条目上再次修改该元素理论上是被占用的状态，所以从后端逻辑上修改时该元素时不可选状态，需设置一个状态，即修改时，此条需要改动的话所选择的是当前所选中的条目以及未被选择的条目。

　　4、是否与其他字段有联动操作

　　这点设计其实与下拉框的级联类似，当我们在其他字段中选择了某些固定项时，当前字段可能是与该字段进行关联的。我们只能选择与该字段相关联的字段。有时候，甚至为角色或者项目联动，比如固定的人或者模块可以看到不同的项目，这些就关乎权限设计的内容了，在此不多赘述。