巧用 jQuery 筛选器，避免重复代码

http://my.oschina.net/mays/blog/647519

jQuery的强大不用多说，但实际项目中，往往仅限于 jQuery(“…”).val() 之类的代替 document 取个值，设定个值而已。对于相对复杂的表单或者页面，如果不能使用合适的工具，将会极大降低效率，降低代码可读性。

项目中的代码是这样的：

html form（简化了的）：

…茫茫多的表单项（不仅仅是input，还包括各种select等）
JS验证代码：

如果JS一整屏甚至好几屏都是这个样子，相信看上去并不那么舒服，而且调试会很累人。那如何改进呢？

首先调整表单项，把相关的东西整在一起（高内聚）：

…各种表单项（不仅仅是input，还包括各种select等）
这里做了两个调整，1：去掉 id 属性，原因是在一个复杂页面中，并不能保证页面中后续加载的 dom 里不包含同样 id 的设置（此坑项目中已有人踩过），需要选定某个表单项可以用 jQuery(“#form_id input[name=instName]”) 这类选择器代替，这么做的好处是只要在表单内保证 name 唯一即可。2：增加 data-valid 属性，一般 data- 打头，名字可以随便起，与后面 js 对应即可，内容则为表单验证的 JSON 字符串。

修改 js 如下：

如果还需要解释，那就去看 jQuery api吧。