JavaScript中,当用户表单填写不正确,如果通过JavaScript阻止用户提交表单?

 我来答
旋律小逍遥碧
2016-09-02
知道答主
回答量:11
采纳率:0%
帮助的人:11.3万
展开全部

用户提交表单会触发onsubmit事件,我们可以为onsubmit事件编写监听函数,当在onsubmit监听函数中检查到表单填写不正确,就return false,阻止表单的提交。若填写正确,就return true,提交表单。

 

举个简单的例子:

当我们按下提交按键时,若检测到用户没有填写邮箱,则阻止用户提交并提示填写邮箱地址!

首先,我们要编写onload的处理函数,并不是onsubmit,而是onload事件哦!

// 当网页加载完毕会触发onload事件。

window.onload =  function() {

prepareEventHandlers(); //在该函数中处理onsubmit事件。

};

 

先处理onload事件是因为我们要在onsubmit事件处理函数中要引用网页中的表单元素,这样能确保页面已经完全加载后才对表单中的元素进行访问。

 

然后在prepareEventHandlers函数中添加onsubmit处理代码:

function prepareEventHandlers() {

document.getElementById("frmContact").onsubmit = function() {

// 如果没有邮箱,阻止表单提交。

if (document.getElementById("email").value == "") {

document.getElementById("errorMessage").innerHTML = "请至少填写邮箱地址!";

// 阻止表单提交

return false;

} else {

// 允许表单提交

document.getElementById("errorMessage").innerHTML = "";

return true;

}

};

}

 

在处理onsubmit的匿名函数中,首先用if语句判断email元素的value属性是否为空。即判断用户是否填写了邮箱。

若用户没有填写邮箱则设置errorMessage的文本,提示用户填写邮箱,并返回false,表示阻止表单的提交。若用户填写了邮箱则清空errorMessage文本并返回true,表示允许表单的提交。推荐你去一个教程网站-秒秒学上看下JavaScript的课程,讲解的还不错。

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式