实用的JS工具类（二）——JS动态加载、密码强度提示、高亮度元素

    这次提供三个一起，呵呵，分别是：密码强度检测、高亮度指定元素、JS动态加载~~

js 代码

1. /**-----------------------------------------------------------------------  
2. * ----------------------------密码强度检测类-----------------------------  
3. * -----------------------------------------------------------------------  
4. */  
5. function Password() {};   
6. Password.check = function(/*string*/pwd, /*string*/tipsDivId) {   
7.     var id = Password.getResult(pwd);   
8.     var msg = ["密码过短", "密码强度差", "密码强度良好", "密码强度高"];   
9.     var sty = [-45, -30, -15, 0];   
10.     var col = ["#999999", "#66CC00"];   
11.     var sWidth = 300, sHeight = 15;   
12.       var Bobj = $(tipsDivId);   
13.       if (!Bobj) return;   
14.          
15.       with (Bobj) {   
16.           style.fontSize = "12px";   
17.           style.width = sWidth + "px";   
18.           style.height = sHeight + "px";   
19.           style.lineHeight = sHeight + "px";   
20.     }   
21.     var html = "";   
22.     for (var i = 0; i < msg.length; i ++) {   
23.         var bg_color = (i <= id) ? col[1] : col[0];   
24.         html += "" + bg_color + ";'>   ";   
25.     }   
26.     Bobj.innerHTML = html;   
27.     Bobj.title = msg[id];   
28. };   
29. Password.getResult = function(/*string*/pwd) {   
30.     if (pwd.length < 6) return 0;   
31.     var ls = 0;   
32.     if (pwd.match(/[a-z]/ig)) ls++;   
33.     if (pwd.match(/[0-9]/ig)) ls++;   
34.     if (pwd.match(/(.[^a-z0-9])/ig)) ls++;   
35.     if (pwd.length < 6 && ls > 0) ls--;   
36.     return ls;   
37. };   
38.   
39. /**-----------------------------------------------------------------------  
40. * ----------------------------高亮度指定的元素---------------------------  
41. * -----------------------------------------------------------------------  
42. */  
43. function HighLight() {};   
44. HighLight.options = {   
45.     id : null,   
46.     className : null,   
47.     interval : 255,   
48.     times : 3000   
49. };   
50. HighLight.prototype = {   
51.     exe : function(/*object*/options) {   
52.         var _options = {};   
53.         if (typeof(options) == 'object') {   
54.             _options.id = options.id || HighLight.options.id;   
55.             _options.className = options.className || HighLight.options.className;   
56.             _options.interval = options.interval || HighLight.options.interval;   
57.             _options.times = options.times || HighLight.options.times;   
58.         }   
59.         if (_options.id == null || !$(_options.id)) {   
60.             alert('必须指定要高亮度显示的元素ID！');   
61.             return false;   
62.         } else if (!_options.className || typeof(_options.className) != 'string' || _options.className.strip() == '') {   
63.             alert('请指定高亮度显示的CSS名称！');   
64.             return false;   
65.         }   
66.         var elt = $(_options.id);   
67.         if (elt.highLightHandle != null) return;   
68.         elt.highLightHandle = setInterval(function() {   
69.             Element.toggleClassName(elt, _options.className);   
70.         }, _options.interval);   
71.         window.setTimeout(function() {   
72.             clearInterval(elt.highLightHandle);   
73.             Element.removeClassName(_options.className);   
74.             elt.removeAttribute('highLightHandle');   
75.         }, _options.times);   
76.         return true;   
77.     }   
78. };   
79.   
80. /**-----------------------------------------------------------------------  
81. * ----------------------------Js动态加载类-------------------------------  
82. * ---注意使用时必须保证被加载的JS文件是使用UTF-8保存，否则会出现中文乱码！  
83. * -----------------------------------------------------------------------  
84. */  
85. function JsLoader()    {};   
86. JsLoader.loaded = [];   
87. JsLoader.prototype = {   
88.     _path : null, // 要加载的JS的路径   
89.     _head : null, // 文档对象的head头对象   
90.     /**  
91.      * 主要调用方法.  
92.      */  
93.     require : function(/*String*/jsPath, /*function*/callback) {   
94.         if (!this._check(jsPath)) return false;   
95.         if (this._isload(jsPath)) return true;   
96.         this._ajaxLoad(callback);   
97.         return true;   
98.     },   
99.     load : function(/*String*/jsPath, /*function*/callback) {   
100.         return this.require(jsPath, callback);   
101.     },   
102.     _check : function(jsPath) {   
103.         if (!jsPath) {   
104.             alert('请指定要加载的JS路径！');return false;   
105.         }   
106.         var head = document.getElementsByTagName('head');   
107.         if (!head || head.length < 1) {   
108.             alert('文档对象document必须有HEAD头！');return false;   
109.         }   
110.         this._path = jsPath;   
111.         this._head = head[0];   
112.         return true;   
113.     },   
114.     _isload : function(jsPath) {   
115.         for (var i = 0; i < JsLoader.loaded.length; i ++) {   
116.             if (JsLoader.loaded[i].toLowerCase() == jsPath.toLowerCase()) return true;   
117.         }   
118.         JsLoader.loaded[JsLoader.loaded.length] = jsPath;   
119.         return false;   
120.     },   
121.     _ajaxLoad : function(callback) {   
122.         var head = this._head;   
123.         base.request(this._path, function(xmlHttp, error) {   
124.             var script = document.createElement('script');   
125.             script.type = "text/javascript";   
126.             script.text = xmlHttp.responseText;   
127.             head.appendChild(script);   
128.             if (!callback) return;   
129.             try {   
130.                 if (typeof(callback) == 'function')  callback();   
131.                 else eval(callback);   
132.             } catch (ex) {alert(ex.message);};   
133.         });   
134.     }   
135. };  

声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。

推荐链接

123行：
base.request(this._path, function(xmlHttp, error)
base没有定义啊？

不行的。。。。。

呵呵，base.request是我的一个ajax请求，是基于prototype.js的，这个是一个实用方法，可以自己写的，我写的一个实用类中的这个方法如下：

	request : function(/*string*/_url, /*function*/onSuccess, /*string*/paras, /*string*/_method) {
		new Ajax.Request(
			_url,
			{
				method : !_method ? 'POST' : _method,
				evalScripts : true,
				parameters : !paras ? '' : paras,
				onComplete : onSuccess
			}
		);
	},