web前端：Layui提交表单时验证必选的多选框是否有选中

作者:不合格的小书虫更新于： 2020-04-07 22:12:26

　　事实上，layui更多是面向于后端开发者，所以在组织形式上毅然采用了几年前的以浏览器为宿主的类AMD模块管理方式，却又并非受限于CommonJS的那些条条框框，它拥有自己的模式，更加轻量和简单。layui定义为"经典模块化"，并非是刻意强调"模块"理念本身，而是有意避开当下JS社区的主流方案，试图以尽可能简单的方式去诠释高效!它的所谓经典，是在于对返璞归真的执念，它以当前浏览器普通认可的方式去组织模块!

　　问题

　　Layui在表单提交时，会有checkbox是必选的，需要在提交的时候进行验证。

　　解决方法

　　在html中添加表单相应内容

　　提交

　　在Javascript中进行验证

　　说明

　　1checkbox的命名需要是name+[]，如上面例子中使用的是test[]。

　　2Object.keys(data)是用来获取数据中的键，返回值是一个数组，数组的值为data的键名。

　　3Array.filter()用来获取数组中符合要求的值，传入的是callback，返回值是一个数组。上面例子中的函数体是通过正则来进行匹配的，由于checkbox的name设置为test[]，与正则中的test对应，在使用的时候只需要将test改为相应的name值即可。

　　4最后，在验证不通过时，可以使用returnfalse来阻止提交。

　　layui认为这种轻量的组织方式，仍然可以填补WebPack以外的许多场景。所以它坚持采用经典模块化，也正是能让人避开工具的复杂配置，重新回归到原生态的Html/CSS/JavaScript本身!