JS共通Check页面元素方法

    之前写过浅解读JS中的call和apply这个随笔，一直没有给出好的例子，表示很抱歉。

    今天正好要和别人分享技术点。一时间也不知道要说点什么。正好看到这个博客，就继这个博客和部门里面的人分享下。

    以前在写C#的时候，做过一个csv文件中数据的Check这样的功能，当时为了简单，可复用性，就写了一个委托数组，利用委托数组来实现的数据Check。想想那个玩意还是很好用的，于是把那个思想用到JS这边来。

    关于知识点方面的东西，我这里就不重复了，大家可以去看看之前的博文。这里就直接看看如何在JS中实现可服用性的页面元素的Check了啊。

    如果明白了前文中的Call方法，相信这里没有什么难度的。只是把多个知识点整合起来就好了。

    好了，不废话了。

    请见如下代码片段：

    

 1     <script language="javascript" type="text/javascript">
 2         var len = function (s) { return s.length; }
 3         /**
 4          * 长度的Check
 5         */
 6         var chkLen = function () {
 7             this.check = function () {
 8                 var chkStr = arguments[0][0];
 9                 var maxLen = arguments[0][1];
10                 if (len(chkStr) > maxLen) {
11                     return "长度不能超过" + maxLen;
12                 }
13                 return "";
14             }
15         }
16 
17         /**
18          * 数值类型Check
19         */
20         var chkNum = function () {
21             this.check = function () {
22                 var chkStr = arguments[0];
23                 var reg = /\d/;
24                 if (!reg.test(chkStr)) {
25                     return "只能入力数字";
26                 }
27                 return "";
28             }
29         }
30 
31         /**
32         * 函数工厂
33         */
34         var chkFactory = function () {
35             return this.check(arguments[0]);
36         }
37 
38         /**
39         * 执行Check操作
40         */
41         var chkExec = function (chkM, params, chkAll) {
42             var i = 0;
43             var errArr = new Array();
44             for (var index = 0; index < chkM.length; index++) {
45                 var result = chkFactory.call(chkM[index], params[index]);
46                 if (len(result) != 0) {
47                     errArr[i] = result;
48                     i++;
49                     if (!chkAll) {
50                         return errArr;
51                     }
52                 }
53             }
54             return errArr;
55         }
56 
57         /**
58         * 按钮事件
59         */
60         function btnCheckValue_Click() {
61             var chkStr = window.document.getElementById("txtUserName").value;
62             var chkM = [new chkLen(), new chkNum()];
63             var params = new Array();
64             params[0] = [chkStr, 10];
65             params[1] = chkStr;
66 
67             var errMsg = chkExec(chkM, params, true);
68             for (var index in errMsg) {
69                 alert(errMsg[index]);
70             }
71         }
72     </script>

View Code