javascript中怎么设置from提交前的数据验证

 我来答
仉彭0J6a82
推荐于2017-09-10
知道答主
回答量:17
采纳率:100%
帮助的人:11.8万
展开全部

form表单的数据先由js判断处理,通过后再提交数据到后台。

1、js获取表单数据,根据实际情况判断是否符合规则。一般的判断是否为空,是否含有不安全字符,有就过滤掉(这一步也可以在后台处理)。

2、对于未通过的输入,向用户返回信息提示。

3、验证通过,提交数据到后台。

4、根据实际需求做处理.....

下面是一个简单的例子:

<form id="loginForm" action="" method="post">
    用户名: <input id="username" name="username" type="text" maxlength="16" />
    <br />
    <input id="go" type="button" value="提交" />
</form>
<script>
    var loginForm = document.getElementById('loginForm');
    var go = document.getElementById('go');
    go.onclick = function(){
        var username = loginForm.username.value
        //这里判断了用户名的输入不能为空,且长度为6-16位
        if(username && (typeof(username)!='undefined') && (username!=0) && (username.length>=6) && (username.length<=16)){
            //验证通过,提交表单数据
            loginForm.submit();
        }else{
            alert('输入不符合规则');
        }
    }
</script>

通常要先在前端对数据做处理得情况下,并不是用<input type="submit" />按钮,而是用<input type="button" />按钮,因为要先对数据进行处理再提交到后台;对于数据的判断验证,大多是使用正则表达式来判断的,虽然比较麻烦,不过如今浏览器对html5的兼容则省掉不少麻烦,新增的 input 类型可以满足一般的需求。

TableDI
2024-07-18 广告
VLOOKUP函数在Excel中主要用于垂直查找数据,但无法直接一次性匹配多行数据。若要实现这一功能,可以采取以下方法:1. 使用辅助列和数组公式,通过IF函数结合TE电商平台TJOIN函数将多个匹配值合并到一个单元格中。2. 利用VLOO... 点击进入详情页
本回答由TableDI提供
qqlxinye
推荐于2017-09-01 · TA获得超过1980个赞
知道大有可为答主
回答量:2257
采纳率:65%
帮助的人:517万
展开全部
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>春芽子服饰 进销存管理系统</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<STYLE type=text/css>
BODY {
MARGIN: 0px
}
TD {
FONT-SIZE: 9pt; LINE-HEIGHT: 150%
}
.big {
FONT-SIZE: 10.5pt; LINE-HEIGHT: 150%
}
.input {
BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid; BORDER-LEFT: #666666 1px solid; BORDER-BOTTOM: #666666 1px solid
}
FORM {
MARGIN: 0px
}
.STYLE1 {color: #999999}
</STYLE>

<SCRIPT>

function validateform()
{
getresult=true;
if (!check_empty(document.form.username.value))
{
getresult=false
alert("请输入用户名!")
document.form.username.focus()
}
else if (!check_empty(document.form.password.value))
{
getresult=false
alert("请输入登录口令!")
document.form.password.focus()
}
document.form.password.value=MD5(document.form.password.value);
return getresult;
}

function check_empty(intext)
{
return (intext.length > 0);
}
function check_email()
{
var mailstr=document.form.email.value;
if (mailstr=="") return false;
if (mailstr.indexOf("@")==-1) return false;
if (mailstr.indexOf(".")==-1) return false;
return true;
}
</SCRIPT>

<META content="MSHTML 6.00.2900.3157" name=GENERATOR></HEAD>
<BODY bgColor=#ffffff>
<TABLE cellSpacing=0 cellPadding=0 width=532 align=center border=0>
<TBODY>
<TR align=middle>
<TD height=80></TD></TR>
<TR align=middle>
<TD><IMG src="images/logo.jpg" ></TD></TR>
<TR align=middle>
<TD>
<FORM name=form onSubmit="return validateform()" action=logincheck.asp
method=post>
<TABLE cellSpacing=0 cellPadding=0 width="70%" border=0>
<TBODY>
<TR>
<TD class=big align=middle></TD>
<TD></TD></TR>
<TR>
<TD height=25 colspan="2" align=middle class=big>用 户 名:
<INPUT class=input size=36
name=username> </TD>
</TR>
<TR>
<TD height=25 colspan="2" align=middle class=big>登录口令:
<INPUT class=input type=password
size=40 name=password onclick="this.value=''"> </TD>
</TR>
<TR>
<TD class=big align=middle height=25></TD>
<TD align=right></TD></TR></TBODY></TABLE>
<TABLE cellSpacing=0 cellPadding=0 width="70%" align=center border=0>
<TBODY>
<TR align=right>
<TD><INPUT type=image
src="images/login.gif" border=0 name=imageField alt="登陆"> </TD></TR>
<TR align=right>
<TD></TD></TR>
<TR align=right>
<TD></TD></TR></TBODY></TABLE></FORM></TD></TR>
<TR align=middle>
<TD align="middle"><span class="STYLE1">copy right by chunyazi 2007,designer:qqlxinye</span> </TD>
</TR>
</TBODY></TABLE>
</BODY></HTML>
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
林岑影
2015-09-13 · 超过24用户采纳过TA的回答
知道答主
回答量:48
采纳率:0%
帮助的人:30.8万
展开全部
<form id="form">
<input type="text" id="i1">
<input type="text" id="i2">
<input type="submit" id="s1">
</form>
<script>
document.getElementById("s1").addEventListener("onclick", function(){
if (document.getElementById("i1").value=="") { alert("i1不能为空"); reutrn false; }
if (document.getElementById("i2").value=="") { alert("i2不能为空"); return false; }
});
</script>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友f384730
2008-08-16 · 超过31用户采纳过TA的回答
知道答主
回答量:122
采纳率:0%
帮助的人:105万
展开全部
在表单的的submit事件里设置验证函数,验证成功返回 true否则返回false,或者提交按钮不使用submit使用button 设置此buttion的click 事件里设置验证函数,成功则document.forms[0].submit() ---(请根据实际情况修改代码)
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

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

类别

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

说明

0/200

提交
取消

辅 助

模 式