我创建了一个捕获用户电子邮件地址的 Web 表单。我已经设置了需要满足的条件，以便用户能够提交他们的电子邮件地址，并且我能够成功返回错误消息。
但是，如果用户输入无效代码，他们在关闭错误后仍会被引导至下一个屏幕。
HTML:
<form class="watch-films" onsubmit="location.href='thankYou_watch.html'">
<p class="paid_in_full">Email</p>
<input class="field2" name="viewerEmail" id="viewerEmail" placeholder="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="9be2f4eee9fef6faf2f7dbfee3faf6ebf7feb5f8f4f6" rel="noreferrer noopener nofollow">[email protected]</a>" required>
<div>
<button type="submit" class="button_done" value="submit">Submit</button>
</div>
</form>
Javascript:
const watchForm = document.querySelector('.watch-films');
const feedback = document.querySelector('.feedback');
const viewerEmailPattern = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
watchForm.addEventListener('submit', e=> {
e.preventDefault();
//validation
const viewerEmail = watchForm.viewerEmail.value;
if(viewerEmailPattern.test(viewerEmail)){
return (true)
} else {
alert("You have entered an invalid email address!")
return (false);
}
console.log(watchForm.viewerEmail.value);
});
感谢任何帮助!
最佳答案
您有一个提交事件处理程序，无论其他提交事件处理程序的结果是什么，它都会将浏览器重定向到感谢页面。
onsubmit="location.href='thankYou_watch.html'"
由于它会重定向，因此会停止提交数据，因此您不会收集电子邮件地址。
彻底摆脱它。
让读取提交的表单数据的服务器端进程生成感谢页面。
关于javascript - 电子邮件无效 > 需要用户留在同一页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59813387/