📄 password field validation - help - javascript.htm
字号:
type="submit" value="Submit Application"<BR>onSubmit="if(this.value
== 'Continue')
this.form.submit();"><BR></body><BR></html><BR><BR>Thanks
in advance for all replies. Mike<BR></DIV><!-- / message -->
<DIV style="FONT-SIZE: 9pt; MARGIN: 20px 0px 10px"><!-- controls -->
<DIV
style="text-decorations: underline"></DIV><!-- / controls --></DIV><!-- message, attachments, sig --></DIV></DIV><!-- / post #311313 --><!-- post #311313 -->
<DIV
style="BORDER-TOP: #999 1px solid; MARGIN-BOTTOM: 15px; MARGIN-TOP: 5px; PADDING-BOTTOM: 50px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 20px"><!-- user info -->
<DIV><!-- avatar float left --><A
href="http://bytes.com/forum/member.php?u=" rel=nofollow><IMG
alt="Michael Winter's Avatar" border=0 class=avtr
src="password field validation - help - JavaScript_files/noavatar.gif"></A>
<DIV id=postmenu_311313>
<DIV style="FONT-SIZE: 9pt">Michael Winter <SPAN
style="FONT-WEIGHT: normal"><A
href="http://bytes.com/forum/post311313-5.html" rel=nofollow
style="FONT-SIZE: 9pt" target=new>July 20th, 2005 01:28 PM</A>
</SPAN></DIV>
<DIV style="COLOR: #666; FONT-SIZE: 9pt">Guest - n/a Posts </DIV>
<DIV style="COLOR: #666; FONT-SIZE: 9pt">#5: Re: password field
validation - help</DIV></DIV></DIV><!-- / user info --><BR>
<DIV style="FONT-SIZE: 10pt; MARGIN-LEFT: 64px"><!-- message, attachments, sig --><!-- message -->
<DIV style="PADDING-TOP: 10px">Mike wrote on 30 Nov
2003:<BR>[color=blue]<BR>> <html><BR>>
<head><BR>> <title>Test Page 01</title><BR>>
<META http-equiv="Content-Script-Type"<BR>>
content="text/javascript"> <script
type="text/javascript"><BR>> function checkPw(element)
{<BR>> pw1 =
document.forms['FormName'].elements['pw1'].value;<BR>><BR>>
pw2 = element.value;<BR>> if (pw1 != pw2) {<BR>> window.alert
("Passwords do not match. Please<BR>> re-enter.");
document.FormName.pw1.value="";<BR>> window.alert ("Please enter
a password.");<BR>> document.FormName.pw2.value="";<BR>>
window.alert ("Please re-enter your password.");<BR>>
document.FormName.pw1.focus();<BR>> }<BR>> // --><BR>>
</script><BR>> </head><BR>> <body><BR>>
<form action="http://www.photoshelf.net/cgi-bin/mailto"<BR>>
onsubmit="return FrontPage_Form1_Validator(this)"
method="post"<BR>> name="FormName"><BR>> <input
type="text" name="UserName" size="20" maxlength="60"><BR>>
<input type="password" name="pw1" size="20"
maxlength="60"><BR>> <input type="password" name="pw2"
size="20" maxlength="60"<BR>> "this.value"><br><BR>>
<input type="submit" value="Submit Application"<BR>>
onSubmit="if(this.value == 'Continue')
this.form.submit();"><BR>> </body><BR>>
</html>[/color]<BR><BR>If this is exactly what you are
testing, it's because the function<BR>(used in the form onsubmit
event) FrontPage_Form1_Validator() doesn't<BR>exist.<BR><BR>You
should remove the closing SGML comment (// -->) at the end of
the<BR>script block.<BR><BR>Finally, you should remove the onsubmit
event on the submit button.<BR>INPUT elements (of any type) don't
have such an event, so it means<BR>and does nothing.<BR><BR>Here's
some advice to help you do the other things you asked about
in<BR>your original post:<BR><BR>You've already got the maximum
lengths restricted in your HTML. To<BR>set a minimum length, use
[control reference].value.length.
For<BR>example:<BR><BR>document.forms['FormName'].elements['pw1'].value.length<BR><BR>To
disable the submit button, place the following at the end of
the<BR>validation script so it will be executed when the form
validates<BR>correctly:<BR><BR>document.forms['FormName'].elements['submitButtonName'].disabled
=<BR>true;<BR><BR>If you make all these changes and add a proper
onsubmit event handler<BR>for the form, your document above would
look something like:<BR><BR><!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML
4.01//EN"<BR>"http://www.w3.org/TR/html4/strict.dtd"><BR><BR><HTML><BR><HEAD><BR><META
http-equiv="Content-Script-Type"
content="text/javascript"><BR><BR><TITLE>Test Page
01</TITLE><BR><BR><SCRIPT
type="text/javascript"><BR>function checkPw(form) {<BR>var pw1 =
form.elements['pw1'];<BR>var pw2 = form.elements['pw2'];<BR>var
minPasswordLength = 6;<BR><BR>// Check password length<BR>if
((minPasswordLength > pw1.value.length)<BR>|| (minPasswordLength
> pw2.value.length)) {<BR>window.alert(<BR>'Passwords must be at
least ' + minPasswordLength<BR>+ ' characters
long.');<BR>pw1.focus();<BR>return false;<BR>}<BR><BR>// Check
password match<BR>if (pw1.value != pw2.value)
{<BR>window.alert(<BR>'The passwords do not match. Please
re-enter.');<BR>pw1.value = '';<BR>pw2.value =
'';<BR>pw1.focus();<BR>return false;<BR>}<BR><BR>// By now, the
passwords have been validated. The form can be<BR>// submitted, and
the submit button (I've named it 'apply'<BR>// for this example) can
be disabled.<BR>form.elements['apply'].disabled = true;<BR>return
true;<BR>}<BR></SCRIPT><BR></HEAD><BR><BR><BODY><BR><FORM
name="FormName"
method="post"<BR>action="http://www.photoshelf.net/cgi-bin/mailto"<BR>onsubmit="return
checkPw(this)"><BR><INPUT type="text" name="UserName"
size="20" maxlength="60"><BR><INPUT type="password" name="pw1"
size="20" maxlength="60"><BR><INPUT type="password" name="pw2"
size="20" maxlength="60"><BR><INPUT type="submit" name="apply"
value="Submit
Application"><BR></BODY><BR></HTML><BR><BR>Hope this
helps,<BR>Mike<BR><BR>Sorry, I didn't mean to write this for you,
but there were quite a<BR>few mistakes creeping in that would take
too much explanation to fix.<BR>I think I was giving you too much
new information without explaining<BR>it properly. My
fault.<BR><BR>--<BR>Michael Winter<BR><A
href="http://bytes.com/forum/register.php" rel=nofollow>Join
Bytes!</A>lid (remove ".invalid" to reply)<BR></DIV><!-- / message -->
<DIV style="FONT-SIZE: 9pt; MARGIN: 20px 0px 10px"><!-- controls -->
<DIV
style="text-decorations: underline"></DIV><!-- / controls --></DIV><!-- message, attachments, sig --></DIV></DIV><!-- / post #311492 --><!-- post #311492 -->
<DIV
style="BORDER-TOP: #999 1px solid; MARGIN-BOTTOM: 15px; MARGIN-TOP: 5px; PADDING-BOTTOM: 50px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 20px"><!-- user info -->
<DIV><!-- avatar float left --><A
href="http://bytes.com/forum/member.php?u=" rel=nofollow><IMG
alt="Mike's Avatar" border=0 class=avtr
src="password field validation - help - JavaScript_files/noavatar.gif"></A>
<DIV id=postmenu_311492>
<DIV style="FONT-SIZE: 9pt">Mike <SPAN
style="FONT-WEIGHT: normal"><A
href="http://bytes.com/forum/post311492-6.html" rel=nofollow
style="FONT-SIZE: 9pt" target=new>July 20th, 2005 01:30 PM</A>
</SPAN></DIV>
<DIV style="COLOR: #666; FONT-SIZE: 9pt">Guest - n/a Posts </DIV>
<DIV style="COLOR: #666; FONT-SIZE: 9pt">#6: Re: password field
validation - help</DIV></DIV></DIV><!-- / user info --><BR>
<DIV style="FONT-SIZE: 10pt; MARGIN-LEFT: 64px"><!-- message, attachments, sig --><!-- message -->
<DIV style="PADDING-TOP: 10px">Michael Winter
<M.Winter@blueyonder.co.uk.invalid> wrote in message
news:<Xns944496C0A542DMWinterBlueyonder@193.38.113.46>...[color=blue]<BR>>
Mike wrote on 30 Nov 2003:<BR>>[color=green]<BR>> >
<html><BR>> > <head><BR>> >
<title>Test Page 01</title><BR>> > <META
http-equiv="Content-Script-Type"<BR>> >
content="text/javascript"> <script
type="text/javascript"><BR>> > function checkPw(element)
{<BR>> > pw1 =
document.forms['FormName'].elements['pw1'].value;<BR>>
><BR>> > pw2 = element.value;<BR>> > if (pw1 != pw2)
{<BR>> > window.alert ("Passwords do not match. Please<BR>>
> re-enter."); document.FormName.pw1.value="";<BR>> >
window.alert ("Please enter a password.");<BR>> >
document.FormName.pw2.value="";<BR>> > window.alert ("Please
re-enter your password.");<BR>> >
document.FormName.pw1.focus();<BR>> > }<BR>> > //
--><BR>> > </script><BR>> >
</head><BR>> > <body><BR>> > <form
action="http://www.photoshelf.net/cgi-bin/mailto"<BR>> >
onsubmit="return FrontPage_Form1_Validator(this)"
method="post"<BR>> > name="FormName"><BR>> >
<input type="text" name="UserName" size="20"
maxlength="60"><BR>> > <input type="password" name="pw1"
size="20" maxlength="60"><BR>> > <input type="password"
name="pw2" size="20" maxlength="60"<BR>> >
"this.value"><br><BR>> > <input type="submit"
value="Submit Application"<BR>> > onSubmit="if(this.value ==
'Continue') this.form.submit();"><BR>> >
</body><BR>> > </html>[/color]<BR>><BR>> If
this is exactly what you are testing, it's because the
function<BR>> (used in the form onsubmit event)
FrontPage_Form1_Validator() doesn't<BR>> exist.<BR>><BR>>
You should remove the closing SGML comment (// -->) at the end of
the<BR>> script block.<BR>><BR>> Finally, you should remove
the onsubmit event on the submit button.<BR>> INPUT elements (of
any type) don't have such an event, so it means<BR>> and does
nothing.<BR>><BR>> Here's some advice to help you do the other
things you asked about in<BR>> your original
post:<BR>><BR>> You've already got the maximum lengths
restricted in your HTML. To<BR>> set a minimum length, use
[control reference].value.length. For<BR>>
example:<BR>><BR>>
document.forms['FormName'].elements['pw1'].value.length<BR>><BR>>
To disable the submit button, place the following at the end of
the<BR>> validation script so it will be executed when the form
validates<BR>> correctly:<BR>><BR>>
document.forms['FormName'].elements['submitButtonName'].disabled
=<BR>> true;<BR>><BR>> If you make all these changes and
add a proper onsubmit event handler<BR>> for the form, your
document above would look something like:<BR>><BR>>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"<BR>>
"http://www.w3.org/TR/html4/strict.dtd"><BR>><BR>>
<HTML><BR>> <HEAD><BR>> <META
http-equiv="Content-Script-Type"
content="text/javascript"><BR>><BR>> <TITLE>Test Page
01</TITLE><BR>><BR>> <SCRIPT
type="text/javascript"><BR>> function checkPw(form) {<BR>>
var pw1 = form.elements['pw1'];<BR>> var pw2 =
form.elements['pw2'];<BR>> var minPasswordLength =
6;<BR>><BR>> // Check password length<BR>> if
((minPasswordLength > pw1.value.length)<BR>> ||
(minPasswordLength > pw2.value.length)) {<BR>>
window.alert(<BR>> 'Passwords must be at least ' +
minPasswordLength<BR>> + ' characters long.');<BR>>
pw1.focus();<BR>> return false;<BR>> }<BR>><BR>> //
Check password match<BR>> if (pw1.value != pw2.value) {<BR>>
window.alert(<BR>> 'The passwords do not match. Please
re-enter.');<BR>> pw1.value = '';<BR>> pw2.value = '';<BR>>
pw1.focus();<BR>> return false;<BR>> }<BR>><BR>> // By
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -