当前页面: 开发资料首页 → Javascript 专题 → 用JavaScript编制留言簿程序
用JavaScript编制留言簿程序
摘要: 用JavaScript编制留言簿程序
---- 我 们 提 供 了 一 个 表 单， 表 单 里 有 姓 名、 客 人 的 电 子 邮 件 地 址、 使 用 的 浏 览 器 版 本、 国 家 名、 意 见 和 建 议 和 所 喜 欢 的 站 点 等 等。 客 人 填 写 完 这 些 字 段 后， 按Submit 按 钮， 信 息 就 会 通 过 电 子 邮 件 的 形 式 寄 给 你。 程 序 中 提 供 了 几 个 函 数， 大 部 分 是 用 来 对 字 段 进 行 合 法 性 检 查 的。 下 面 我 们 对 函 数 作 一 个 简 单 的 说 明。
---- 函 数 Reset() 按Reset 按 钮 后 对 各 字 段 的 内 容 复 位。
---- 函 数 submitForms() 按submit 按 钮 后 对 字 段 合 法 性 检 查 后 发 送 电 子 邮 件。
---- 函 数 isName() 对 姓 名 字 段 进 行 合 法 性 检 查。
---- 函 数 isEmail() 对 电 子 邮 件 地 址 字 段 进 行 合 法 性 检 查。
---- 函 数 isBrowser() 对 浏 览 器 字 段 与 自 动 检 测 的 浏 览 器 版 本 进 行 比 较。
---- 函 数 isCountry() 对 国 家 字 段 进 行 合 法 性 检 查。
---- 函 数 isComment() 对 意 见 字 段 进 行 合 法 性 检 查， 不 允 许 为 空 值。
---- 函 数 isFavorite() 对 喜 欢 的 站 点 字 段 进 行 合 法 性 检 查， 不 允 许 为 空 值。
---- 程 序 中 还 提 供 了 一 些 技 巧， 例 如， 如 何 判 断 浏 览 器 的 版 本， 字 符 串 的 操 作 等 等。
---- 结 果 是 以 电 子 邮 件 的 形 式 提 供 给 你 的， 里 面 有 客 人 输 入 的 各 个 字 段。 程 序 比 较 长， 但 不 难 看 懂， 下 面 是 源 代 码：
< HTML >
< HEAD >
< TITLE > 用JavaScript 编 制 留 言 簿 程 序< /TITLE >
< SCRIPT LANGUAGE=JavaScript >
< !-- Begin
//Someone@abc.com 是 你 自 己 的 电 子 邮 件 地 址
var emailAddress=Someone@abc.com;
function toName()
{
var toNameval=document.forms[0].elements[1].value;
toNameval = mailto:Someone@abc.com?subject=Guest Book example;
this.document.mail.action = toNameval;
}
function Reset() {
document.forms[0].elements[0].value = ;
document.forms[0].elements[1].value = ;
document.forms[0].elements[2].value =
navigator.appName + + navigator.appVersion;
document.forms[0].elements[3].value = ;
document.forms[0].elements[4].value = ;
document.forms[0].elements[5].value = ;
document.forms[0].elements[0].focus();
}
function submitForms() {
if ( (isName() ) && (isEmail()) && (isBrowser())
&& (isCountry()) && (isComment()) && (isFavorite()) )
if (confirm(\nYoure about to e-mail the form.\n\nClick
on YES to submit.\n\nClick on NO to abort.))
{
alert(\nYour submission will now be made to :
\n\n+emailAddress+\n\n\nThank you!);
return true;
}
else
{
alert(\nYou have chosen to abort the submission.);
return false;
}
else
return false;
}
function isName() {
var str = document.forms[0].elements[0].value;
if (str == ) {
alert(\nThe NAME field is blank.\n\nPlease enter your name.)
document.forms[0].elements[0].focus();
return false;
}
for (var i = 0; i < str.length; i++)
{
var ch = str.substring(i, i + 1);
if (((ch < a || z < ch) && (ch < A || Z < ch)) && ch != )
{
alert(\nThe NAME field only accepts letters
& spaces.\n\nPlease re-enter your name.);
document.forms[0].elements[0].select();
document.forms[0].elements[0].focus();
return false;
}
}
return true;
}
function isEmail()
{
emailAddress=document.forms[0].elements[1].value;
if (document.forms[0].elements[1].value == ) {
alert(\nThe E-MAIL field is blank.
\n\nPlease enter your e-mail address.)
document.forms[0].elements[1].focus();
return false;
}
if (document.forms[0].elements[1].value.indexOf (@,0) == -1 ||
document.forms[0].elements[1].value.indexOf (.,0) == -1)
{
alert(\nThe E-MAIL field requires a \@\
and a \.\be used.\n\nPlease re-enter your e-mail address.)
document.forms[0].elements[1].select();
document.forms[0].elements[1].focus();
return false;
}
else
{
toName();
return true;
}
}
function isBrowser()
{
if (document.forms[0].elements[2].value !
= navigator.appName + + navigator.appVersion)
{
if (confirm(\nYouve changed your browser
type.\n\nClick on OK to keep changes.
n\nClick on Cancel to restore detected browser.))
return true
else
{
document.forms[0].elements[2].value =
navigator.appName + + navigator.appVersion;
return true;
}
}
else
return true;
}
function isCountry() {
var str = document.forms[0].elements[3].value;
if (str == ) {
alert(\nThe COUNTRY field is
blank.\n\nPlease enter your country.)
document.forms[0].elements[3].focus();
return false;
}
for (var i = 0; i < str.length; i++) {
var ch = str.substring(i, i + 1);
if (((ch < a || z < ch) &&
(ch < A || Z < ch)) && ch != )
{
alert(\nThe COUNTRY field only accepts
letters & spaces.\n\nPlease re-enter your country.);
document.forms[0].elements[3].select();
document.forms[0].elements[3].focus();
return false;
}
}
return true;
}
function isComment() {
if (document.forms[0].elements[4].value == ) {
if (confirm(\nYoure about to submit
without leaving a comment.\n\nClick
on CANCEL to include a comment.\n\nClick
on OK to continue without a comment.))
return true
else
{
document.forms[0].elements[4].focus();
return false;
}
}
else
return true
}
function isFavorite() {
if (document.forms[0].elements[5].value == ) {
if (confirm(\nYoure about to submit without
listing your favorite sites.\n\nClick on CANCEL
to include favorites.\n\nClick on OK to continue
without listing favorites.))
return true
else
{
document.forms[0].elements[5].focus();
return false;
}
}
else
return true
}
// End -- >
< /SCRIPT >
< /HEAD >
< BODY >
< CENTER >
< FORM ENCTYPE=text/plain
NAME=mail METHOD=GET
ACTION=mailto:Someone@abc.com
onSubmit=return submitForms()>
< TABLE BORDER=0 WIDTH=400 >
< TR >
< TD align=center > < FONT COLOR=800000 >
< STRONG >Enter your name:< /STRONG >< /FONT >< /TD >
< TD align=center > < FONT COLOR=800000 >
< STRONG >Enter your e-mail address:< /STRONG >
< /FONT >< /TD >
< /TR >
< TR >
< TD align=center> < INPUT TYPE=text
NAME=name SIZE=30 MAXLENGTH=40 >< /TD >
< /TD >
< TD align=center > < INPUT TYPE=text
NAME=email SIZE=30 MAXLENGTH=40 >< /TD >
< /TR >
< TR >
< TD align=center > < FONT COLOR=800000 >
< STRONG >Your browser < /STRONG >< /FONT >< /TD >
< TD align=center> < FONT COLOR=800000 >
< STRONG >Enter your country:< /STRONG >< /FONT >< /TD >
< /TR >
< TR >
< TD align=center > < INPUT TYPE=text
NAME=browser SIZE=30 MAXLENGTH=60 >< /TD >
< TD align=center > < INPUT TYPE=text
NAME=country SIZE=30 MAXLENGTH=60 >
< /TD >
< /TR >
< /TABLE >
< CENTER >
< FONT COLOR=800000 >< STRONG >
Leave a comment or suggestion:< /strong > < /font >< BR >
< TEXTAREA NAME=comments
ROWS=5 COLS=50 wrap=yes >Comments?
Suggestions?< /TEXTAREA >< P >< P >
< FONT COLOR=800000 >< STRONG >
List your favorite sites:< /STRONG >< /FONT >< BR >
< TD align=center >< TEXTAREA NAME=favorites
ROWS=5 COLS=50 wrap=yes >
Any sites I should take a look at?< /TEXTAREA >
< P >< P >
< INPUT TYPE=submit VALUE=Submit >
< center >< INPUT TYPE=reset VALUE=Reset
onClick=Reset() >
< /FORM >
< /CENTER >
< /BODY >
< /HTML >
↑返回目录
前一篇: 垂直滚动信息板
后一篇: “牵一发而动全局”onMouseover的灵活运用