让我们设想一个带有两个提交按钮的HTML表单.其中一个位于表格的上半部分,并做一些不那么重要的事情.另一个按钮是实际提交按钮,用于保存输入的数据.此按钮位于表单的末尾.这两个按钮将触发不同的动作网址.
有经验的用户喜欢通过按"输入"或"返回"而不是单击相应按钮来提交表单.
不幸的是,浏览器将查找当前表单的第一个提交按钮,并使用它来执行表单提交.因为在我的表单中第二个按钮是实际的提交按钮,我需要告诉浏览器使用这个特定按钮(或与之关联的action-url).
我没有链接javascript监听器,它正在寻找按键或类似的东西.所以我正在寻找一个更好的解决这个问题的方法.但是,欢迎javascript或jquery解决方案(没有keypressed-listerner).
非常感谢你的帮助.
将您的第一个按钮更改为a .
理论上至少,你可以submit
在表单中有三个按钮.
按钮2是现有的"不太重要"按钮(从表单的中间向下),按钮3是现有表单中现有的"实际提交"按钮.
按钮1应该被隐藏(使用CSS display:none
或visibility: hidden
),并且应该执行与当前"实际提交"完全相同的功能.我认为它仍然是浏览器找到的第一个按钮,无论其可见性如何.
编辑回应评论:
我以为隐藏的按钮默认也被禁用了?[的md5sum]
这是一个有效的观点,但我在发布之前只在Firefox(3.5.7,Ubuntu 9.10)中进行了测试,其中两种方法的技术都是1.粘贴完整的xhtml文件(下面),这是我在这些评论之后进行测试的基础.
3button form
display: none
应该防止按钮成为表单的活动部分(包含在结果集中,并且符合默认按钮的条件);visibility: hidden
不应该.但是这些情况都被某些浏览器弄错了.拥有一个不可见的第一个提交按钮的常规方法是将position: absolute;
其移出页面(例如,使用left:-4000px).这是丑陋但可靠的.更改其tabindex也是一个好主意,因此它不会干扰预期的表格标签顺序.
至少有两点我必须提出这个评论.为了:
"正常的方式......"我没有意识到有一种正常的方式,并提出这个选项作为实现目标的可能性,完全知道几乎肯定有任何更好的方法,特别是考虑到我没有在同一表单上看到多个提交按钮的充分理由.
鉴于上述观点的后一句话,我想明确表示我不主张这样做.完全没有.感觉就像一个丑陋的,非语义的黑客,有一个以上的提交按钮,在OP的实例中 - 一个按钮显然不是提交按钮.
"位置:绝对"的概念; left:-4000px;`我曾经发生过,但它似乎与`visibility:hidden;`的效果差不多,而且我有一种天生的不喜欢`position:absolute;`无论出于什么原因......所以我去了在撰写本文时我不太反感的选项... =)
我很欣赏你对tabindex的评论,这是我从未想过的东西.
我很抱歉,如果我听起来有点狡猾,已经晚了,我累了...... yadda-yadda; 自从我回到家后,我一直在各种浏览器中进行测试,似乎Firefox 3.5+在Windows XP和Ubuntu 9.10上都提供相同的行为 - 报告"按钮一",所有Webkit浏览器(Midori,Epiphany,Safari和Chrome)都失败了并报告"按钮两个".
因此,display: none;
对于提交按钮来说,这绝对是一个失败的想法.而visibility:hidden
至少是有效的.
我的意思是,无论第一次提交是"display:none;"还是"visibility:hidden",点击"enter"都会触发表单提交事件或表单第一个提交按钮的click事件.
请注意我的jQuery技能是有限的,因此所使用的测试(我一次只运行试图防止执行中发生的冲突,评论我当时没有运行的那个,两者都被显示 - 一个,清楚,评论说)可能是不充分和不具代表性的.