表单仍在提交,尝试使用 e.preventDefault();
Form still submits, trying to use e.preventDefault();
所以我有这张表格。我想检查用户是否验证了验证码,但遇到了问题。这是检查功能的表格。
<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup" onsubmit="check_if_capcha_is_filled()">
这里是判断doSubmit(验证码)是否被验证的函数。
function check_if_capcha_is_filled(e){
if(doSubmit) return true;
e.preventDefault();
alert('Fill in the capcha!');
return false;
};
但是我得到一个错误
Uncaught TypeError: Cannot read property 'preventDefault' of undefined
at check_if_capcha_is_filled
有什么我遗漏的指示吗?谢谢。
这里有两个问题。首先,您需要 return
来自 onsubmit
事件属性的函数。其次,您没有将事件传递给函数——但这只适用于全局事件可用的情况,即。不是 Firefox。
要解决此问题并改进您的逻辑,您可以改为使用 addEventListener()
以不显眼的方式将事件处理程序添加到元素,并删除过时的 on*
事件属性。试试这个:
var doSubmit = false;
document.getElementById('myForm').addEventListener('submit', function(e) {
if (doSubmit)
return;
e.preventDefault();
alert('Fill in the capcha!');
});
<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup">
<button type="submit">Submit</button>
<form>
您的 e.preventDefault 使用不当。它什么都不做,因为你正在将一个事件传递给一个函数,你想像这样将它附加到事件处理程序:
$('form').on('submit', function(e)
{
e.preventDefault();
//rest of code
})
这将停止提交操作。
使用on事件侦听器
改为
<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup" >
$('form').on('submit', function(e){
// validation code here
if(!valid) {
e.preventDefault();
}
});
这是你想要的吗?
<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup">
然后在你的js文件中:
function check_if_capcha_is_filled(){
if (doSubmit){
return true;
}else{
return false;
}
};
$('#myForm').on('submit', function(e){
if (!check_if_capcha_is_filled){
e.preventDefault();
}
});
使用 jQuery 如果您想确认提交。
<button name="delete" class="submitbutton">Delete</button>
$('.submitbutton').click(function() {
var buttonpressed;
buttonpressed = $(this).attr('name');
var r = confirm("Please confirm to " + buttonpressed );
if (r == true) {
$('#yourformid').submit();
} else {
return (false);
}
});
所以我有这张表格。我想检查用户是否验证了验证码,但遇到了问题。这是检查功能的表格。
<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup" onsubmit="check_if_capcha_is_filled()">
这里是判断doSubmit(验证码)是否被验证的函数。
function check_if_capcha_is_filled(e){
if(doSubmit) return true;
e.preventDefault();
alert('Fill in the capcha!');
return false;
};
但是我得到一个错误
Uncaught TypeError: Cannot read property 'preventDefault' of undefined
at check_if_capcha_is_filled
有什么我遗漏的指示吗?谢谢。
这里有两个问题。首先,您需要 return
来自 onsubmit
事件属性的函数。其次,您没有将事件传递给函数——但这只适用于全局事件可用的情况,即。不是 Firefox。
要解决此问题并改进您的逻辑,您可以改为使用 addEventListener()
以不显眼的方式将事件处理程序添加到元素,并删除过时的 on*
事件属性。试试这个:
var doSubmit = false;
document.getElementById('myForm').addEventListener('submit', function(e) {
if (doSubmit)
return;
e.preventDefault();
alert('Fill in the capcha!');
});
<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup">
<button type="submit">Submit</button>
<form>
您的 e.preventDefault 使用不当。它什么都不做,因为你正在将一个事件传递给一个函数,你想像这样将它附加到事件处理程序:
$('form').on('submit', function(e)
{
e.preventDefault();
//rest of code
})
这将停止提交操作。
使用on事件侦听器
改为
<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup" >
$('form').on('submit', function(e){
// validation code here
if(!valid) {
e.preventDefault();
}
});
这是你想要的吗?
<form data-id="embedded_signup:form" id="myForm" class="ctct-custom-form Form" name="embedded_signup" method="POST" action="https://visitor2.constantcontact.com/api/signup">
然后在你的js文件中:
function check_if_capcha_is_filled(){
if (doSubmit){
return true;
}else{
return false;
}
};
$('#myForm').on('submit', function(e){
if (!check_if_capcha_is_filled){
e.preventDefault();
}
});
使用 jQuery 如果您想确认提交。
<button name="delete" class="submitbutton">Delete</button>
$('.submitbutton').click(function() {
var buttonpressed;
buttonpressed = $(this).attr('name');
var r = confirm("Please confirm to " + buttonpressed );
if (r == true) {
$('#yourformid').submit();
} else {
return (false);
}
});