当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > 轻松玩转花样表单--表单提交

HTML/XHTML教程
Web浏览器模式的选择机制
XHTML+CSS建站如何调用样式表
HTML5和CSS3新的WEB标准和浏览器支持
HTML代码:网页头部代码全清楚
网页制作:HTML代码编写的30条技巧
HTML教程:link标记的rel属性
网页设计参考:firefox的默认样式
网页设计初学者必看的30个网页制作秘笈
网页制作推荐使用的XHTML标记
网页HTML代码讲解:有序列表和无序列表
IE8开发人员工具的菜单讲解
提高用户体验与新窗口打开网页的关系
解决IE支持HTML5的问题
了解如何减少 reflow 次数
平面设计理论:创造视觉冲击力作品
网页HTML 有序列表ol 和无序列表 ul
HTML Frameset 例子代码
让输入框关闭自动完成(AutoComplete)功能
IE支持HTML5的解决方法
基础 HTML之目录问题(相对路径和绝对路径区别)

HTML/XHTML教程 中的 轻松玩转花样表单--表单提交


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 103 ::
收藏到网摘: n/a

三、表单的提交

  既然表单是用来采集用户输入的数据,那么,就应该保证用户的数据被准确地提交到预定的地点,也就是说,我们在表单提交的时候,应该对用户的数据进行检验,一来可以避免用户误输数据,二来可以避免用户输入非法的,或者说不合格的数据;检验合格以后,还要保证用户的数据提交到特定的程序。

  1.数据的检验

  数据的检验,通常有两种程序:客户端检验和服务器端检验。客户端检验,比较快,服务器端检验,相对来说比较慢,为了确保安全,通常同时采用,这样就可以避免用户刻意破坏。
  不管采用什么方式,数据检验的原理都是一样的,一旦用户输入的数据不符合规定,就报错,要求用户重新输入,客户端检验常使用Javascrip脚本,服务器端的视系统而定,本文不对数据检验的具体程序设计进行探讨,仅仅列举几个例子来说明。

 样例19
:必填项,以及简单的数据类型检验
用户名: 密码:
公司用户 个人用户

  分析:
这里首先用到的是form的onSubmit="TwoSubmit(this)"
然后根据选择的分支,来分别递交到不同的程序,TwoSubmit()函数如下:

<script>
function TwoSubmit(form){
if (form.Ref[0].checked){
form.action = "cop.asp";//这里是分之一
}else{
form.action = "ind.asp";//这里是分之二
}
form.submit();
}
</script>

  3.用任何元素提交表单

  是不是只有按钮或者图片按钮才能提交表单呢?当然不是,实际上,任何页面元素都可以提交表单,不过嘛,都是通过脚本来完成的,下面我们就使用链接来代替Submit按钮:

 样例21
:用链接来提交表单
用户名: 密码: 登录 清空


  分析:

  通过onClick="document.form.submit()"来提交表单;用onClick="document.form.reset()"来复位表单,这样一来,任何一个元素都可以实现提交表单了。