| 网站首页 | 文章中心 | 电子书下载 | 矢量图库 | 视频教程 | 素材下载 | 程序代码下载 | JS代码 | 论坛 | 
常用软件类:
|杀毒安全 |联络聊天 |网络软件 |多媒体类 |系统工具 |图形图像 |系统工具 |应用软件 |行业软件
开发设计类:
|动画制作 |图像处理 |3D设计 |操作系统 |站长学院 |网络相关 |WEB设计 |数据库类 |程序开发
javascript教程---表格(forms)
作者:佚名    文章来源:网络    点击数:    更新时间:2006-9-20
  输 入 表 单 (form) 对 某 些 Internet 上 的 网 页 而 言 是 很 重 要 的。 通 常 form 的 输 入 内 容 会 被 送 回 server 中 做 处 理。 JavaScript 具 有 确 认 输 入 值 的 功 能, 可 以 事 先 确 保 这 些 值 是 属 於 "合 法 的",进 而 避 免 将 错 误 的 输 入 值 送 回 server。 首 先 我 将 告 诉 您 如 何 对 form 的 输 入 做 确 认 的 工 作, 再 来我 将 会 提 到 用 JavaScript 将 资 料 送 回 server 的 可 能 性。

咱 们 开 始 吧 ! 我 先 写 一 个 简 单 的 语 法。 在 下 面 我 加 了 两 个 text- 元 件 (element), 请 将 您 的 大 名 写入 第 一 个 空 格, 并 将 您 的 e-mail address 写 入 第 二 个 空 格。 您 可 在 这 两 个 空 格 中 任 意 输 入 并 按 下按 钮。 您 也 可 以 不 输 入 任 何 东 西 就 按 下 按 钮 试 试 !

请 输 入 您 的 大 名 :

请 输 入 您 的 e-mail address :

对 第 一 个 空 格 而 言, 若 您 没 有 键 入 任 何 东 西, 电 脑 便 会 出 现 一 个 错 误 讯 息, 并 请 您 再 输 入 一 次。当 然, 此 空 格 会 把 任 何 输 入 的 字 串 都 视 为 "合 法 的" 输 入, 它 无 法 辨 认 出 您 输 入 的 名 字 是 正 确 的或 是 胡   的。 即 始 您 输 入 的 是 数 字, 它 也 会 把 此 数 字 当 成 您 的 大 名。 例 如 您 输 入 '17', 它 将 会显 示 '嗨 ! 17'。
第 二 个 空 格 就 设 计 得 稍 微 复 杂 一 点 了。 您 可 试 着 输 入 一 个 简 单 的 字 串 - 例 如 您 的 大 名, 它 将 会显 示 错 误 讯 息, 并 请 您 再 输 入 一 次 (除 非 您 输 入 的 字 串 含 有 @ ...)。 这 个 空 格 的 确 认 标 准 是 检 视您 输 入 的 字 串 中 是 否 含 有 @ 。 即 使 只 输 入 一 个 @, 它 也 会 被 视 为 合 法 的 输 入 --- 虽 然 这 也 不 是正 确 的 e-mail address。 所 有 Internet 的 e-mail address 皆 含 有 @ , 因 此 对 e-mail address 输 入 值做 此 种 确 认 工 作 是 很 适 合 的。

接 下 来 看 看 上 述 功 能 的 原 始 码 吧 :

<html>
<head>
<script language="JavaScript">
<!-- Hide

function test1(form) {
  if (form.text1.value == "")
    alert("您 没 写 上 任 何 东 西, 请 再 输 入 一 次 !")
  else { 
   alert("嗨 "+form.text1.value+"! 您 已 输 入 完 成 !");
  }
}

function test2(form) {
  if (form.text2.value == "" || 
      form.text2.value.indexOf('@', 0) == -1) 
        alert("这 不 是 正 确 的 e-mail address! 请 再 输 入 一 次 !");
  else alert("您 已 输 入 完 成 !");
}
// -->
</script>
</head>

<body>
<form name="first">
Enter your name:<br>
<input type="text" name="text1">
<input type="button" name="button1" value="输 入 测 试" onClick="test1(this.form)">
<P>
Enter your e-mail address:<br>
<input type="text" name="text2">
<input type="button" name="button2" value="输 入 测 试" onClick="test2(this.form)">
</body>

[1] [2] 下一页


相关文章