用于发布表单输入值的Javascript函数

Question

我有一个php页面，我在那里管理密码更改请求，我在调用javascript函数检查新密码是否至少有一个特殊字符，然后再次调用同一页面让php更新数据库的密码字段时遇到了问题。

这是我的html:

<form name="changePassword" onsubmit="return CheckPassword()" method="post"
accept-charset="utf-8">
Current Password:
<input name="currPwd" type="password" size="40" maxlength="200" id="currPwd"
placeholder="Current Password" required/>
New Password:
<input name="newPwd" type="password" size="40" maxlength="200" id="newPwd"
placeholder="New Password" required/>
Repeat New password:
<input name="rNewPwd" type="password" size="40" maxlength="200" id="rNewPwd"
placeholder="Repeat New Password" required/>
<input type="submit" id="changepsw" value="Change Password"/>
</form>

这是我的javascript代码：

function CheckPassword () {
var pass1 = document.getElementById('newPwd');
var pass2 = document.getElementById('rNewPwd');
var isOk = true;
var res1 = /^(?=.*[ -/:-@[-_])([w -/]).+$/.test(pass1);
var res2 = /^(?=.*[ -/:-@[-_])([w -/]).+$/.test(pass2);
if ((res1 == false) || (res2 == false)) {
isOk = false;
} else {
$.ajax({
type: 'POST',
url: 'updatepswd.php',
data: $'form'.serialize()
});
}
return isOk;
}

点击提交按钮，它应该调用js函数，检查密码是否至少包含一个特殊字符，然后调用php进行更新，但实际情况是，即使密码没有任何特殊字符，它也会调用php页面。

我是错过了什么还是做错了什么？

---

编辑：

在测试函数中使用jquery时，我也没有使用jquery将.value添加到密码字段中

var res1 = /^(?=.*[ -/:-@[-_])([w -/]).+$/.test(pass1.value);

我没有使用ajax，而是使用

document.changePassword.submit();

Answer 1

function Test(password) {
var regex = [
/[W]+/, // I check for the presence of at least one special character 
/[a-z]+/, // I check for at least one lowercase letter 
/[A-Z]+/, // I verify the presence of at least one capital letter 
/[d]+/ // I verify the presence of at least one number 
];
for (var i = 0; regex[i]; i++) {
if (!regex[i].test(password)) return false;
}
return true;
}
function Send() {
var psw1 = $('#newPwd').val();
var psw2 = $('#rNewPwd').val();
if (Test(psw1) && psw1 === psw2) {
alert('OK!');
/*
$.ajax({
type: 'POST',
url: 'updatepswd.php',
data: $('form').serialize()
});
*/
} else alert('ERROR!');
}
$(function() {
$('#changepsw').click(Send);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="changePassword" onsubmit="return false;" method="post" accept-charset="utf-8">
Current Password:
<input name="currPwd" type="password" size="40" maxlength="200" id="currPwd" placeholder="Current Password" required/>
New Password:
<input name="newPwd" type="password" size="40" maxlength="200" id="newPwd" placeholder="New Password" required/>
Repeat New password:
<input name="rNewPwd" type="password" size="40" maxlength="200" id="rNewPwd" placeholder="Repeat New Password" required/>
<input type="submit" id="changepsw" value="Change Password"/>
</form>

好吧，你使用的正则表达式对我来说似乎不是最好的，但是为了编写它们，我通常使用这个网站：https://www.debuggex.com/

但是，回到我们这里，通常为了检查用户输入的密码，我使用这个小函数，它只在输入的正则表达式都正确的情况下返回TRUE：

function Test(password){
var regex =[
/[W]+/, // I check for the presence of at least one special character 
/[a-z]+/, // I check for at least one lowercase letter 
/[A-Z]+/, // I verify the presence of at least one capital letter 
/[d]+/  // I verify the presence of at least one number 
];
for(var i = 0; regex[i]; i++){
if(!regex[i].test(password)) return false;
}
return true;
}

我还注意到，要读取您使用的用户输入的密码：

var pass2 = document.getElementById("rNewPwd"); 

但通过这样做，你得到的是项目，而不是它包含的文本，对吧？因此TEST功能在所有情况下都将失败。

如果我可以建议你，一个简单的方法来获得输入值是：

var data = $('#your_ID').val();

或

var data = $('.your_class').val();

我希望我能帮上忙