43,737
社区成员
发帖
与我相关
我的任务
分享setcustomvalidity如何使用 详细实例
要求对密码进行二次输入验证，即第二次输入密码必须与第一次输入内容相同才可以提交，否则提示“”您两次输入密码不一致，请重新输入！“”
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>setcustomvalidity</title>
<script language="javascript">
</script>
</head>
<body>
<form action="" method="get">
<ul>
<li><label>用户名</label></li>
<input type="text" name="username" required="required" />
<li><label>密码</label></li>
<input type="password" name="password" required="required" placeholder="请输入密码"/>
<li><label>请再次输入密码</label></li>
<input type="password" name="password1" required="required" placeholder="请再次输入密码"/><br />
<input type="submit" name="submit"/>
</ul>
</form>
</body>
</html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>setcustomvalidity</title>
<script language="javascript">
</script>
</head>
<body>
<form action="" method="get">
<ul>
<li><label>用户名</label></li>
<input type="text" name="username" required="required" />
<li><label>密码</label></li>
<input type="password" name="password" required="required" placeholder="请输入密码"/>
<li><label>请再次输入密码</label></li>
<input type="password" name="password1" required="required" placeholder="请再次输入密码"/><br />
<input type="submit" name="submit"/>
</ul>
</form>
</body>
</html>
...全文
请发表友善的回复…
发表回复
Paranoid_CN 2016-09-26
- 打赏
- 举报
最终正确结果 = =
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>setcustomvalidity</title>
<script language="javascript">
function setErrorInfo()
{
var ps1 = document.getElementById("password-1");
var ps2 = document.getElementById("password-2");
if (ps1.value==ps2.value)
{
alert("两次密码输入相同");
}
else (ps1.value!=ps2.value)
{
alert("两次密码输入不一致");
ps2.setCustomValidity("两次密码输入不一致");
</script>
</head>
<body>
<form id ="123" onsubmit = "return setErrorInfo " action="" method="get">
<ul>
<li><label>用户名</label></li>
<input type="text" name="username" required="required" />
<li><label>密码</label></li>
<input type="password" name="password" required="required" placeholder="请输入密码"/>
<li><label>请再次输入密码</label></li>
<input type="password" name="password1" required="required" placeholder="请再次输入密码"/><br />
<input type="submit" name="submit"/>
</ul>
</form>
</body>
</html>
Paranoid_CN 2016-09-26
- 打赏
- 举报
此为正解 - -
<script language="javascript">
function setErrorInfo()
{
var ps1 = document.getElementById("password-1");
var ps2 = document.getElementById("password-2");
if (ps1.value==ps2.value)
{
alert("两次密码输入相同");
}
else if (ps1.value!=ps2.value)
{
ps2.setCustomValidity(两次密码输入不一致);
}
else
{
alert("两次密码输入相同");
}
}
</script>
Paranoid_CN 2016-09-25
- 打赏
- 举报
<script language="javascript">
function setErrorInfo()
{
var ps1 = document.getElementById("password-1");
var ps2 = document.getElementById("password-2");
if (ps1.value==ps2.value)
{
alert("两次密码输入相同");
}
else if (ps1!=ps2.setCustomValidity())
{
alert("两次输入密码不相同,请重新输入");
}
else
{
alert("两次密码输入相同");
}
}
</script>
