我有一个表单页面,打算使用Ajax提交。我的计划是1.使用Ajax检查电子邮件是否已经存在2.检查密码是否匹配3.如果是,切换到另一个"屏幕",然后4.使用Ajax 提交表单
我很困惑,因为validate函数没有运行。当密码不匹配时,它既不会切换屏幕也不会发出警报。因此,表格也不会被提交。我的代码低于
$('form input:last-child').click(function(e){
e.preventDefault();
var allFields = e.target.parentNode;
function validate () {
if (allFields.elements[3].value !== allFields.elements[4].value) {
return false; // If they don't match, return false
} else {
$('#form-div form').css('left', '-70%');
$('#confirm p').css('margin-left', '-12%'); // else switch screens
}
}
if (validate != false) {
$('#hidden').load("server_script.php"); // `hidden` is a hidden div somewhere on the page
} else
alert ("Passwords do not match");
});
我在想,如果它们不匹配,那么事件侦听器的其余部分就不会运行,因为false从那时起终止了函数。所以我尝试在事件侦听器之外创建一个validate函数的实例,并在click函数内部调用它,但由于依赖变量的原因,它无法解析,所以我不知道如何进行。
更新附加了关联的HTML。(额外的好处:正则表达式模式与2个或多个字母不匹配)
<div id=form-div>
<form method=POST action="" >
First Name: <br> <input type=text name=first_name pattern="[a-z]{2,}" required /> <br> <br>
Last Name: <br> <input type=text name=last_name pattern="[a-z]{2,}" required /> <br> <br>
Email: <span id=emailReport></span> <br> <input type=email name=email id=email required /> <br> <br>
Password: <br> <input type=password name=password required pattern=".{6,}" title="Password must be six or more characters" /> <br> <br>
Confirm password: <br> <input type=password name=password required /> <br> <br>
<input type=hidden name=sign_up_date />
<input type=submit value='sign up' />
</form>
<div id=confirm> <p>Some text</p> </div>
</div>
</div>
您忘记调用"validate"函数。正如您的代码所显示的那样,您只是声明了函数而没有执行它。
validate
函数未被调用。为什么不简单地删除函数定义,使代码成为click
函数的一部分呢?
您没有正确调用验证函数
函数调用必须具有()
,即validate()
,而不是validate
$('form input:last-child').click(function(e){
e.preventDefault();
var allFields = e.target.parentNode;
function validate () {
if (allFields.elements[3].value !== allFields.elements[4].value) {
return false; // If they don't match, return false
} else {
$('#form-div form').css('left', '-70%');
$('#confirm p').css('margin-left', '-12%'); // else switch screens
}
}
//if (validate != false) {
if (validate() != false) {
$('#hidden').load("server_script.php"); // `hidden` is a hidden div somewhere on the page
} else
alert ("Passwords do not match");
});