如何在 js 中验证 asp.net 的密码?

Question

我有这个输入：

.aspx

<input type="password" id="password" name="password" data-fv-stringlength-min="5" class="form-control col-md-7 col-xs-12" required="required" pattern="password" title="Follow the password requirement"/>

.js

if( pattern ){
var regex, jsRegex;
switch( pattern ){
case 'alphanumeric' :
regex = /^[a-zA-Z0-9]+$/i;
break;
case 'numeric' :
regex = /^[0-9]+$/i;
break;
case 'phone' :
regex = /^+?([0-9]|[-|' '])+$/i;
break;
case 'password':
regex = /^(?=.{8,})(?=.*[a-zA-Z])(?=.*d)(?=.*[!#$%&? "])+$/i;
break;
}
}

密码大小写无法正常工作。 当我单击密码字段并输入任何字母时，它卡住了，我无法输入任何字母！

编辑

在 ASPX 中，我使用以下脚本：

<!-- validator -->
<script>
// initialize the validator function
validator.message.date = 'not a real date';
// validate a field on "blur" event, a 'select' on 'change' event & a '.reuired' classed multifield on 'keyup':
$('form')
.on('blur', 'input[required], input.optional, select.required', validator.checkField)
.on('change', 'select.required', validator.checkField)
.on('keypress', 'input[required][pattern]', validator.keypress);
$('.multi.required').on('keyup blur', 'input', function() {
validator.checkField.apply($(this).siblings().last()[0]);
});
//$('#add_member_form').formValidation();

$('form').submit(function(e) {
e.preventDefault();
var submit = true;
// evaluate the form using generic validaing
if (!validator.checkAll($(this))) {
submit = false;
}
if (submit)
this.submit();
return false;
});
</script>
<!-- /validator -->

注意：

我正在使用免费的引导模板。 因此，所有代码都写在模板中，我尝试对其进行编辑以满足我的需求并尝试理解它。

编辑2：模式代码在验证器中.js"随模板一起来">

var validator = (function($){
var message, tests;
message = {
invalid         : 'invalid input',
email           : 'email address is invalid',
tests = {
email : function(a){
if ( !email_filter.test( a ) || a.match( email_illegalChars ) ){
alertTxt = a ? message.email : message.empty;
return false;
}
return true;
},
text: function (a, skip) {
if( pattern ){ // pattern code },
number : function(a){ // number code // },
date : function(a){ // date code // },

Answer 1

您的问题不清楚，需要更多详细信息

首先，选择一种方法

实际上，您有两种选择来获得想要做的事情。

HTML5，使用模式属性

许多输入类型能够管理自己的模式 (如电子邮件，电话，密码... 您必须将模式指定到属性"模式"中， 没有分隔符/.../(和选项)

<input 
type="password" 
id="password"
name="password" 
data-fv-stringlength-min="5" 
class="form-control col-md-7 col-xs-12" 
required="required" 
pattern="^(?=.{8,})(?=.*[a-zA-Z])(?=.*d)(?=.*[!#$%&? "])+$" 
title="Follow the password requirement"/>

但要小心转义可能与属性引号冲突的引号

JS，来自控件 JavaScript

因为我不明白你的"不完整"代码在做什么(在你的帖子中)。 我想，您已经在输入上定义了一些onKeyDown事件，以便在用户编写和调用函数下的实际代码时捕获？ 我没有看到匹配输入值所需的条件！ 你能用更多详细信息更新你的帖子吗，我也会更新我的。

---

如果您选择继续使用插件

好的，关于你的edit2，使用我猜jquery.form.validator：

var validator = (function($){
var message, tests;
message = 
{
invalid : 'invalid input',
email   : 'email address is invalid',
};
tests = 
{
// <input type="email">
email : function(a)
{
if( !email_filter.test( a ) || a.match( email_illegalChars ) )
{
alertTxt = a ? message.email : message.empty;
return false;
}
return true;
},
// this is for <input type="text">
text: function (a, skip)
{
if( pattern ){ // pattern code },
},
// this is for <input type="number">
number : function(a){ /* number code */ },
date : function(a){ /* date code */ },
};

然后，我认为您必须将密码方法添加到测试中：

// this is for <input type="password">
password: function (a, skip)
{
if( pattern ){ /* pattern code */},
},

---

或者我向你提议，一个更简单的

而不是需要解决方案的插件，通过重用您的原始代码 来自您的(第一篇重复帖子)如何在引导程序中验证密码字段？

注意：停止使用removeClass(...).addClass(...)，更愿意 简短而相关的方法，如toggleClass(classname, condition)或switchClass(classbefore, classafter)

.CSS

.invalid { color: red!important; } /* note this important flag is require to overwrite the .valid class */
.valid   { color: lime; }

网页提示

<div id="pswd_info">
<h4>Password requirements:</h4>
<ul>
<li id="letter" class="fa-warning"> At least <strong>one letter</strong></li>
<li id="capital"> At least <strong>one capital letter</strong></li>
<li id="number"> At least <strong>one number</strong></li>
<li id="special"> At least <strong>one special character</strong></li>
<li id="length"> Be at least <strong>8 characters</strong></li>
<li id="password"> Must contains at least <strong>8 characters</strong>, specials chars (#$!...) and numbers</li>
</ul>
</div>
</div>

Jquery

$("form input").on("keyup", function(event)
{
var invalidClass = "invalid";
var type = $(this).attr("type");
var val = $(this).val();
switch(type)
{
case "email": /*  */ break;
case "phone": /* */ break;
case "number": 
{
var smt = (/^d$/i.test(val);
$('#number').toggleClass(invalidClass, smt);
break;
}
case "password": 
{
var smt = (/^(?=.*[0-9])(?=.*[!@#$%^&*])[a-zA-Z0-9!@#$%^&*]{6,16}$/i.test(val);
$('#password').toggleClass(invalidClass, smt);
break;
}
}
}).on("focus", function()
{
$('#pswd_info').show();
}).on("blur", function()
{
$('#pswd_info').hide();
});