使用ASP.NET Atlas开发检测密码强度的自定义Behavior
点击次数：24 次 发布日期：2008-11-26 12:37:34 作者：源代码网
|
源代码网推荐 源代码网推荐 Atlas中提供了客户端JavaScript强大的面向对象功能，这几天看到了上述二位的帖子，觉得这个功能需求在日常开发中还是很常见的。晚上闲来无事，将上述功能封装为Atlas中的Behavior，以方便重用。关于Atlas的Behavior，请参考：在ASP.NET Atlas中创建自定义的Behavior。 源代码网推荐 源代码网推荐 按照在ASP.NET Atlas中创建自定义的Behavior这篇文章的五个自定义步骤，很容易写出了这个Behavior。其中最重要的部分为检验密码强度的算法，这里我偷了个懒，只是简单的将THIN的代码完全Copy过来（兄弟不要骂我-_-b），有心的朋友可以将它重构成更“Atlas”的样子。这个检测函数将在每次用户在相应的input中按键时被触发： 源代码网推荐 源代码网推荐 function keyPressHandler() { 源代码网推荐 源代码网推荐 // you may refactor this part to make the code more "Atlas like" :-) 源代码网推荐 var PasswordStrength ={ 源代码网推荐 Level : ["高，实在是高","还行啦","靠，这样也行"], 源代码网推荐 LevelValue : [30,20,0],//强度值 源代码网推荐 Factor : [1,2,5],//字符加数,分别为字母，数字，其它 源代码网推荐 KindFactor : [0,0,10,20],//密码含几种组成的加数 源代码网推荐 Regex : [/[a-zA-Z]/g,/d/g,/[^a-zA-Z0-9]/g] //字符正则数字正则其它正则 源代码网推荐 } 源代码网推荐 PasswordStrength.StrengthValue = function(pwd) 源代码网推荐 { 源代码网推荐 var strengthValue = 0; 源代码网推荐 var ComposedKind = 0; 源代码网推荐 for(var i = 0 ; i < this.Regex.length;i++) 源代码网推荐 { 源代码网推荐 var chars = pwd.match(this.Regex[i]); 源代码网推荐 if(chars != null) 源代码网推荐 { 源代码网推荐 strengthValue += chars.length * this.Factor[i]; 源代码网推荐 ComposedKind ++; 源代码网推荐 } 源代码网推荐 } 源代码网推荐 strengthValue += this.KindFactor[ComposedKind]; 源代码网推荐 return strengthValue; 源代码网推荐 } 源代码网推荐 PasswordStrength.StrengthLevel = function(pwd) 源代码网推荐 { 源代码网推荐 var value = this.StrengthValue(pwd); 源代码网推荐 for(var i = 0 ; i < this.LevelValue.length ; i ++) 源代码网推荐 { 源代码网推荐 if(value >= this.LevelValue[i] ) 源代码网推荐 return this.Level[i]; 源代码网推荐 } 源代码网推荐 } 源代码网推荐 // end of the refactoring section 源代码网推荐 源代码网推荐 $(_checkResultLabelID).innerHTML = PasswordStrength.StrengthLevel(this.control.element.value); 源代码网推荐 } 源代码网推荐 源代码网推荐 同时在这个Behavior中添加了属性checkResultLabelID，用来指定显示检验结果的Label： 源代码网推荐 源代码网推荐 var _checkResultLabelID; 源代码网推荐 this.get_checkResultLabelID = function() { 源代码网推荐 return _checkResultLabelID; 源代码网推荐 } 源代码网推荐 this.set_checkResultLabelID = function(value) { 源代码网推荐 if (_checkResultLabelID != value) { 源代码网推荐 _checkResultLabelID = value; 源代码网推荐 this.raisePropertyChanged("checkResultLabelID"); 源代码网推荐 } 源代码网推荐 } 源代码网推荐 源代码网推荐 您也可以很方便的添加一些更花哨的功能，例如对于不同强度的输入，提示文字的背景颜色有所改变等。完整的源代码请参考本文后面的下载。 源代码网推荐 源代码网推荐 测试的步骤也很简单，首先在ScriptManager中添加这个Behavior的引用： 源代码网推荐 源代码网推荐 <atlas:ScriptManager runat="server" ID="ScriptManager1"> 源代码网推荐 <Scripts> 源代码网推荐 <atlas:ScriptReference Path="PasswordStrengthCheckBehavior.js" /> 源代码网推荐 </Scripts> 源代码网推荐 </atlas:ScriptManager> 源代码网推荐 源代码网推荐 然后在页面上添加一个input，用来输入密码（演示程序中没有设定type为password），和一个span，用来显示检验结果： 源代码网推荐 源代码网推荐 <div> 源代码网推荐 Input a password: 源代码网推荐 <input id="password" type="text" /> 源代码网推荐 <span id="result"></span> 源代码网推荐 </div> 源代码网推荐 源代码网推荐 最后，Atlas Script中将上面的input提升为Atlas控件，并加入我们刚刚写好的Behavior： 源代码网推荐 源代码网推荐 <script type="text/xml-script"> 源代码网推荐 <page xmlns:script="http://schemas.microsoft.com/xml-script/2005"> 源代码网推荐 <components> 源代码网推荐 <textBox id="password"> 源代码网推荐 <behaviors> 源代码网推荐 <passwordStrengthCheckBehavior checkResultLabelID="result" /> 源代码网推荐 </behaviors> 源代码网推荐 </textBox> 源代码网推荐 </components> 源代码网推荐 </page> 源代码网推荐 </script> 源代码网推荐 源代码网推荐 就是这么简单，浏览器中如下： 源代码网推荐 源代码网推荐 简单密码： 源代码网推荐 
源代码网推荐 中等密码： 源代码网推荐 源代码网推荐 
源代码网推荐 源代码网推荐 复杂密码： 源代码网推荐 源代码网推荐 
源代码网推荐 源代码网推荐 源代码以及示例程序可以在此下载：http://www.cnblogs.com/Files/dflying/PasswordStrengthCheckBehaviorDemo.zip 源代码网推荐 做人要厚道，请注明转自酷网动力(www.ASPCOOL.COM)。 源代码网推荐 源代码网供稿. |
