1

这是一个说明问题的 JSFiddle 片段。

在表单中,我image在 hidden中有一个类型的输入div。那个隐藏div的有一个click触发警报的事件(用 jQuery 附加)。我在同一个表单中也有一个基本的文本输入。

在 Chrome 上,当我在文本输入中按 Enter 时,没有任何反应。在 Firefox 上,会触发警报,这意味着 Firefox 会在隐藏的 div 上触发点击事件。

Chrome 和 Firefox 中的哪一个实现了正确的行为,以及如何在没有实现的浏览器上解决此问题?

4

2 回答 2

4

在表单中的单个文本输入中按 enter 会提交表单。在某些情况下,它通过触发点击事件来做到这一点。

在 Firefox 中,它似乎会在表单的默认提交控件上触发单击事件,无论该控件是什么(并且图像输入可以是默认提交控件)。

在 Chrome 中也是如此,但前提是默认提交控件有一个 CSS 框(这就是display:noneChrome 中很重要的原因)。

根据http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#implicit-submission的规范,这里不应该依赖 CSS:无论如何都会运行合成点击激活步骤,因此 Chrome 的行为肯定是错误的。

至于 Firefox,问题是图像输入是否是“提交按钮”。 http://www.whatwg.org/specs/web-apps/current-work/multipage/states-of-the-type-attribute.html#image-button-state-%28type=image%29说事实上是的,所以在这种情况下,Firefox 的行为是正确的。

就解决方法而言,form=""如果您不希望它提交表单,则一种可能的选项是在图像输入上显式设置,这将使其与表单无关,因此不是它的默认提交按钮。

于 2013-10-31T06:25:28.960 回答
0

我不确定您要使用图像类型的输入来完成什么。根据我通过 Google 找到的内容(包括这个SO question),图像输入应该像提交按钮一样起作用。如果它应该像提交按钮一样起作用,那么我会假设在表单上按 enter 会提交它(因此在 FF 中的点击事件)。但是,隐藏按钮时是否应该这样做?虽然我还没有时间研究它,但它似乎是浏览器实现的选择。

至于解决方法,这取决于您要做什么(以及图像类型的输入是否真的是正确的方法)。

于 2013-10-30T20:13:21.097 回答