用javascript响应表单的提交事件_Web开发_学习笔记★闵涛★计算机学习电脑编程软硬件技巧


	转至繁体中文版	\| 网站首页 \| 图文教程 \| 资源下载 \| 站长博客 \| 图片素材 \| 武汉seo \| 武汉网站优化 \|

用javascript响应表单的提交事件

作者：闵涛文章来源：闵涛的学习笔记点击数：701 更新时间：2009/4/23 11:28:06

我们有的时候要在提交表单之前对用户输入的数据进行验证,如果输入的不正确的话,就给一提示,并让从新输入,那么我们是怎么实现的呢?
现在我以一个需求的实现为例进行简要说明：
我的功能要求：
用户输入一个类型，要求是数字，所以我们进行数字验证。
在提交的时候对起类型id字段进行是否为空验证，如果为空的话，就给一个提示，并要求起从新输入

我们的JSP代码如下：
<%@page contentType="text/html; charset=GBK"%>
<html>
<head>
<title>addNewsType</title>

</head>
<body bgcolor="#ffffff">
<h2>新闻类型添加</h2>
<hr />
<form name="form1" method="post" action="<%=request.getContextPath()%>/news/NewsTypeAddAction.sh"

onSubmit="return actionCheck();">

<table>
  <tr>
    <td>新闻类型编号</td>
    <td>
      <input type="text" name="typeid" onBlur="isDigit(this.value)">    </td>
  </tr>
  <tr>
    <td>新闻类型名称</td>
    <td>
      <input type="text" name="typename">    </td>
  </tr>
  <tr>
    <td>新闻存放目录名称</td>
    <td>
      <input type="text" name="dir">    </td>
  </tr>
  <tr>
    <td>使用模版名称</td>
    <td>
      <input type="text" name="templatename">    </td>
  </tr>
  <tr>
    <td colspan="2">
      <div align="center">
        <input type="submit" name="Submit" value="Submit">
        <input type="reset" value="Reset">
      </div></td>
    </tr>
</table>
</form>
<script type="text/javascript">
function isDigit(s)
{
  var patrn=/^[0-9]{1,20}$/;
  if (!patrn.exec(s)&&s!=""){
    alert("请您输入数字!");
    document.form1.typeid.value="";
    document.form1.typeid.focus();
    return false;
  }
}

function  actionCheck(){
  if(document.form1.typeid.value==""){
    alert("新闻类型编号不能为空!");
    document.form1.typeid.value="";
    document.form1.typeid.focus();
    return false;
  }
}
</script>
</body>
</html>

我们的javascript检验部分不需要解释，主要是我们的检验代码要在要在form的onSubmit事件中实现，并且要使用return 返回值才能实现。也就是下划线显示的部分。
自己的一点粗浅认识，望多指教。

没有相关教程

教程录入：mintao 责任编辑：mintao

上一篇教程： JavaScript实现页面之间传递参数的方法

下一篇教程： JavaScript中的高级特性及特别对象、属性和方法

【字体：小大】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】

注：本站部分文章源于互联网，版权归原作者所有！如有侵权，请原作者与本站联系，本站将立即删除！本站文章除特别注明外均可转载，但需注明出处！ [MinTao学以致用网]

　网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！）

同类栏目

· Web开发  · 网页制作
· 平面设计  · 网站运营
· 网站推广  · 搜索优化
· 建站心得  · 站长故事
· 互联动态

热门推荐

没有教程

赞助链接

闵涛博文

500 - 内部服务器错误。

您查找的资源存在问题，因而无法显示。

鄂公网安备 42011102001154号

站长：MinTao ICP备案号：鄂ICP备11006601号-18

闵涛站盟:医药大全-武穴网。A打造B、C、D……