提到<input type="image"  />,说起来有些惭愧。之前的工作基本每周都要制作两到三个注册用户的网页。其中就用它提交表单。

那个时候我想当然的以为这是用js操作,才把表单数据提交的。直到前几天同事问到了这个问题,我还以为用js提交表单,为此还打了一个

赌,虽然赌注很小,不用想结果我输了。今天对它做个总结:

code:

<html lang="zh">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<style>
.sbuImage{
background:url("http://www.58guakao.com/images/user/reg/reg-btn.gif") repeat scroll rgba(, , , );
width:207px;
height:34px;
}
</style>
<body>
<form method="POST" action="http://passport.cnblogs.com/login.aspx?test=testval">
<input type="text" name="uname" value="张三" /></br></br>
<input type="pwd" name="pwd" value="" /></br></br>
<input class="sbuImage" type="image" value="type是image的按钮提交表单" /></br></br>
<input class="sbuImage" type="submit" value="type是submit的按钮提交表单" />
</form>
</body>
</html>

 一.input type="image" 与 type="submit"的区别(下文简写image和submit)

1.这两者都可以响应请求;

2.不同之处是当 method="GET" 时,当鼠标点击image时,除了能正常请求URL,还能把鼠标点击图片时的焦点坐标(注意:

这个焦点坐标是相对于点击的图片说的)作为参数出现在url里,以上面的例子来说,url是:

http://passport.cnblogs.com/login.aspx?uname=%D5%C5%C8%FD&pwd=123&x=168&y=21

url少了一个参数test=testval,下面会提到。

二.简单说一下Form表单里POST请求与GET请求的区别

请求区别:

1.最显然的区别是GET是从服务器获取数据,服务器需要的数据会出现在url里;

2.POST是将数据传给服务器;

参数传递不同:

1.GET请求时,action的url的参数会丢掉,就像上面的url少了test=testval,它只会把form表单里的参数传在url里;

2.POST请求时,action的url的参数不会丢掉,同时也会把form表单里的参数传到服务器;

安全性:

1.GET请求时,表单里的数据都会显示在url里,相对POST请求不安全;

2.POST请求时,表单里的数据不会那样明显显示在客户端;

数据量:

GET请求传递数据量要小于POST请求很多。具体待测。

下面这个链接要详细,可参考:

http://blog.sina.com.cn/s/blog_7ffb8dd501013kdm.html

input type="image" 提交表单的更多相关文章

  1. 阻止form元素内的input标签回车提交表单

    <form></form>标签内input元素回车会默认提交表单. 阻止回车默认提交表单: $('form').on('keydown', function (event) { ...

  2. type="image"提交表单

    <input type="image" style="cursor:pointer; ">

  3. js创建form添加input项目并提交表单

    var generateHideElement = function (name, value) { var tempInput = document.createElement("inpu ...

  4. form表单action提交表单,页面不跳转且表单数据含文件的处理方法

    在最近的项目中需要将含 input[type='file']的表单提交给后台 ,并且后台需要将文件存储在数据库中.之前所用的方法都是先将文件上传到七牛服务器上,然后七牛会返回文件的下载地址,在提交表单 ...

  5. php 提交表单

    滴答…滴答…的雨,欢迎大家光临我的博客. 学习是快乐的,教育是枯燥的. 博客园   首页   博问   闪存     联系   订阅  管理 随笔-58  评论-2017  文章-5  trackba ...

  6. i利用图片按钮 和 input type="image" 为背景提交表单

    <img src="img/cancel.jpg" onclick="javascript:document.getElementByIdx_x('loginFor ...

  7. jquery 通过submit()方法 提交表单示例

    jquery 通过submit()方法 提交表单示例: 本示例:以用户注册作为例子.使用jquery中的submit()方法实现表单提交. 注:本示例仅提供了对表单的验证,本例只用选用了三个字段作为测 ...

  8. 4 django系列之HTML通过form标签来同时提交表单内容与上传文件

    preface 我们知道提交表单有2种方式,一种直接通过submit页面刷新方法来提交,另一种通过ajax异步局部刷新的方法提交,上回我们说了通过ajax来提交文件到后台,现在说说通过submit来提 ...

  9. 总结:JSP几种提交表单方法

    问题描述: 最近进了一家“老公司”工作,说他老不是说他成立的早,是因为他的编程框架太l.......low了.EJB的规范模式,使用是IBM经过Eclipse二次开发出来的RAD(Rational A ...

随机推荐

  1. 937. Reorder Log Files

    You have an array of logs.  Each log is a space delimited string of words. For each log, the first w ...

  2. MySql数据库内部常用命令大全

    1.     连接Mysql 格式: mysql -h主机地址 -u用户名 -p用户密码 1)         连接到本机上的MYSQL. 首先打开DOS窗口,然后进入目录mysql\bin,再键入命 ...

  3. P2480 [SDOI2010]古代猪文 Lucas+CRT合并

    \(\color{#0066ff}{ 题目描述 }\) 猪王国的文明源远流长,博大精深. iPig在大肥猪学校图书馆中查阅资料,得知远古时期猪文文字总个数为N.当然,一种语言如果字数很多,字典也相应会 ...

  4. tinkphp中的自动验证

    tinkphp是国内非常流行的一个开源框架,国内大小公司都在用的框架.对于初学的好多同学感觉不太好上手,其实并没没有大家想的那么复杂.自动验证功能是thinkphp提高的一种数据验证方法,分为动态和静 ...

  5. C语言使用指针表示数组的注意事项

    1)数组名是指针常量 如对指针变量可以进行++运算,但是对数组名却不允许,另外,对数组名的赋值运算也是错误的 2)注意指针变量的当前值 指针变量的值在程序运行过程中可能经常改变,要对此注意 3)数组越 ...

  6. Kibana6.x.x——导航权限控制入门

    按如下图所示设置: 用该用户登录后,界面如图所示: 但遗憾的是,根据官方论坛的说法,其它的导航隐藏控制,暂时还不支持. 参考:https://discuss.elastic.co/t/hide-ina ...

  7. 找出区间[A, B]内所有数字的奇数字位出现次数为偶数,偶数字位出现次数为计数的数的个数。(数位DP)

    题目:找出区间[A, B]内所有数字的奇数字位出现次数为偶数,偶数字位出现次数为计数的数的个数. 分析:这道题的状态同样不好取,因为要求每一个奇数的个数都要为偶数,每一个偶数的位数都要为奇数,又因为只 ...

  8. echarts分段(一段一种颜色)显示

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. hdu1686 KMP 求在字符串A中字符串B出现的次数

    Oulipo Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Subm ...

  10. linux中的目录配置

    一.权限对文件的重要性 1.r(read):可读取此文件的实际内容,读取文本文件的文字内容等. 2.w(write):可以编辑,新增或者是修改该文件的内容. 3.x(execute):该文件具有可以被 ...