可以用button代替input type=”submit”吗?

在ie下,<button>标记恐怕还存在几个不大不小的问题。

在一个表单里,如果有一个以上"submit"类型的<button>标签存在,在表单被提交时,不管你点击哪个<button>,所有<button>的值都会被post/get。<button>的缺省type属性被设置为"button",但是在A级别浏览器下,应该设置为"submit"才对如果你用javascript去访问<button>的value属性,IE却返回了<button>的innerHTML属性,很让人恼火。 (可以使用"getAttributeNode"方法来避免.)

PLAIN TEXT
CODE:

<form>
<button type="submit" value="1" >text 1</button>
<button type="submit" value="2" >text 2</button>
</form>

在IE下,上面两个button的数据都会被提交。并且ie会提交这两个button的innerText而不是value。而其它浏览器仅仅提交你点击的那个button。

留言:

button的值是写在节点之间的,实事上是innerHtml的值~这点上讲比input更灵活一点:例如,你可以设置一个value为TEST
不过个人认为没有必要用button代替input吧

在只有一个button时,或者不放在form里的时候还是可以用的咯
button标签可以有更多的样式,比如可以加个图片什么的。

to vsky:
在firefox下,情况有所不同,表单提交的是button的value属性而不是innerHTML

加个onclick=”return false”就不会提交了…
要不你全用type=”button” ,提交的加一个onclick=”this.form.submit()”

这样的话,还是直接用input来得简单,不容易出现意料之外的行为

我认为 Button 并不是用来代替 input 的.
Button 是为了响应用户交互行为的.不是为了直接通过 Button 的 name 和 值 来向 server 提交数据的.
虽然 button 可以提交 name:value. 但我认为提交数据应该用 input
也就是说应该这样用 Button
提示信息
提交
也就是说 button 里应该永远看不到 name 属性.

关键是合理使用button标签。html被屏蔽是wordpress的默认行为,不过有部分标签是被保留的,比如b,strong,ul,li之类的。

一个表单里,如果有<button>标签存在,它会自动提交表单的更多相关文章

  1. form中的button按钮在IE11中自动提交表单问题导致弹出框关闭之后表单被重置

    最近几天,测试系统,遇到一个兼容性问题,form中有一个button按钮,没有指定type类型,点击按钮弹出框选择值之后回填给form上的一个单行文本框,在IE6.IE7.IE8.IE9.IE10中测 ...

  2. form表单下的button按钮会自动提交表单的问题

    form表单下的button按钮会自动提交表单的问题 2017年01月05日 18:02:44 蓝色水 阅读数:18012更多 个人分类: asp.net   form表单下的按钮在没有指定type类 ...

  3. ssi-uploader上传图片插件,点击选择文件按钮自动提交表单解决办法

    先介绍一下这款插件,然后再谈使用中可能遇到的问题 ssi-uploader是一个JQuery的图片上传插件,界面比较美观 github地址:https://github.com/ssbeefeater ...

  4. java模拟表单上传文件,java通过模拟post方式提交表单实现图片上传功能实例

    java模拟表单上传文件,java通过模拟post方式提交表单实现图片上传功能实例HttpClient 测试类,提供get post方法实例 package com.zdz.httpclient; i ...

  5. java 传入用户名和密码并自动提交表单实现登录到其他系统

    不用单点登录,模拟远程项目的登录页面表单,在访问这个页面的时候自动提交表单到此项目的登录action,就可以实现登录到其他系统. ssh框架项目 1.以下是本地系统的action代码: import ...

  6. 前端表单中有按钮button自动提交表单

    问题描述 在设计表单时,表单内有一个按钮<button>,该按钮是用来获取其他数据或执行其他操作的.并不是让他提交表单. 解决方案 1) 设置 form 的 onsubmit='retur ...

  7. alert警告框点击确定后自动提交表单

    转载于  :https://zhidao.baidu.com/question/619375120140398412.html 在页面中有多个input type="text"的文 ...

  8. 按钮特效-Enter键自动提交表单

    —————————————————————— <script type="text/javascript">                        //当用户按 ...

  9. JS倒计时,自动提交表单!

    <form id="frm" action="http://www.baidu.com"> 考试还剩余<div id="time&q ...

随机推荐

  1. UBUNTU16.04 使用APT-GET如何设置代理

    sudo apt-get   install software-name -o Acquire::http::proxy="http://用户名:密码@代理服务器IP:代理服务器端口&quo ...

  2. 25最短路径之Dijkstra算法

    图的最优化问题:最小生成树.最短路径 典型的图应用问题 无向连通加权图的最小生成树 有向/无向加权图的最短路径 四个经典算法 Kruskal算法.Prim算法---------------最小生成树 ...

  3. 5select的运用

    四.select的运用 --汇总函数 max()最大值,min()最小值,avg()平均值select max(age),min(age),avg(age) from tablename; --算出表 ...

  4. Pointofix 1.7 Portable试用

    Pointofix 1.7 Portable简体中文单文件便携版 软件大小:347K软件语言:简体中文软件类别:国外软件/桌面工具/教育教学运行环境:windows XP/Vista/Win7开 发 ...

  5. MySQL数据库读写分离、读负载均衡方案选择

    MySQL数据库读写分离.读负载均衡方案选择 一.MySQL Cluster外键所关联的记录在别的分片节点中性能很差对需要进行分片的表需要修改引擎Innodb为NDB因此MySQL Cluster不适 ...

  6. 保护Hadoop集群三大方法

    自今年以来,不少恶意软件开始频繁向Hadoop集群服务器下手,受影响最大的莫过于连接到互联网且没有启用安全防护的Hadoop集群. 大约在两年前,开源数据库解决方案MongoDB以及Hadoop曾遭受 ...

  7. 计算概论(A)/基础编程练习2(8题)/2:计算书费

    #include<stdio.h> int main() { // 声明与初始化 ; // k组测试数据的总费用 double s[k]; // 单价表 double price[]= { ...

  8. JAVA注解@Interface基础知识

    java注解是在JDK5时引入的新特性,大多数框架(SpringBoot.MyBatis.Quartz)背后都在大量使用注解开发. 一.先进行一个小试验,了解注解开发流程 建立maven项目annot ...

  9. C++设计模式 之 “对象性能” 模式:Singleton、Flyweight

    “对象性能”模式 面向对象很好地解决了“抽象”的问题,但是必不可免地要付出一定的代价.对于通常情况来讲,面向对象的成本大都可以忽略不计.但是某些情况,面向对象所带来的成本必须谨慎处理. 典型模式 # ...

  10. go learning

    1. vim-go https://github.com/fatih/vim-go-tutorial curl -fLo ~/.vim/autoload/plug.vim --create-dirs ...