表单元素input、button、submit、submit()、onsubmit()详解

来源：互联网发布：数控切割机编程代码编辑：程序博客网时间：2024/05/01 04:08

表单元素input、button、submit、submit()、onsubmit()详解

type=”button”和type=”submit”区别

input作为按钮来使用，其type属性值可为button、submit，其中“button”只是单纯的定义了一个按钮，
而“submit”是定义了一个提交按钮，即把表单数据action给URL。并且使用了“submit”的input支持键盘的enter键，
这提高了页面的易用性，默认enter键对页面出现的第一个submit进行操作。

type=”button”实现type=”submit”功能

view sourceprint?
<form action="" method="" onsubmit="return abc();">
 
<span style="text-decoration: underline;">A</span>:<input type="submit" name="" value="提交"><!--提交表单数据-->
 
<span style="text-decoration: underline;">B</span>:<input type="button" name="" value="提交" onClick="submit()"><!--点击时触发onClick事件，然后激活此form的submit()方法-->
 
<span style="text-decoration: underline;">C</span>:<input type="button" name="" value="提交" onClick="this.form.submit()"><!--点击时触发onClick事件，然后激活此form的submit()方法-->
 
<span style="text-decoration: underline;">D</span>:<input type="button" name="" value="提交" onClick="this.form.onsubmit()"><!--点击时触发onClick事件，然后激活此form的onsubmit()方法-->
 
<span style="text-decoration: underline;">E</span>:<input type="button" name="" value="提交" onClick="onsubmit()"><!--无效-->

功能详解

A 点击（回车）时，首先触发onsubmit事件，然后执行函数abc()，根据函数abc()内容判断是否提交表单数据（无onsubmit时直接提交）
B、C 点击时直接提交表单数据，不会出发onsubmit函数
D 点击时触发onsubmit函数，不会提交表单数据（解决：可以在函数abc中调form的submit()方法来提交）

This entry was posted in Binary on April 15, 2011 by miao.

0 0