我在HTML页面上有一个表单,其中有多个提交按钮,可执行不同的操作.但是,当用户在文本输入中键入值并点击输入时,浏览器通常表现为按顺序激活下一个提交按钮.我想要一个特定的动作发生,所以我发现一个解决方案是在有问题的文本输入后直接将不可见的提交按钮放入HTML中,如下所示:
<input type="text" name="something" value="blah"/>
<input type=submit name="desired" value="Save Earth" style="display: none"/>
...
<input type=submit name="something_else" value="Destroy Earth" />
...
<input id="foobar" type=submit name="desired" value="Save Earth" />
Run Code Online (Sandbox Code Playgroud)
这在大多数浏览器中都很有魅力,除了它在Safari和Chrome等webkit浏览器中没有.出于某种原因,他们跳过了隐形提交按钮.我一直试图弄清楚如何拦截输入键按下并使用Javascript激活正确的提交,但我无法让它工作.拦截keydown并将注意力集中在正确的提交上是行不通的.
有没有办法使用Javascript或其他方式选择当用户点击HTML表单上的文本输入中的回车键时将使用哪个提交按钮?
编辑:为了澄清,表单不能要求Javascript从根本上"工作".如果在webkit浏览器上没有Javascript,我不在乎输入密钥提交是否是不可取的,但是我无法删除或更改提交按钮的顺序.
这是我尝试过的,它不会改变webkit浏览器中的提交行为.
有用的是将以下代码中的focus()更改为click().
document.onkeypress = processKey;
function processKey(e)
{
if (null == e)
e = window.event ;
if (e.keyCode == 13) {
document.getElementById("foobar").click(); // previously: focus()
}
}
Run Code Online (Sandbox Code Playgroud)
编辑:最终解决方案:
适用于每个浏览器,只在需要时拦截输入密钥:
HTML:
<input type="text" name="something" value="blah"
onkeydown="return processKey(event)" />
<input type=submit name="desired" value="Save Earth" style="display: none"/>
...
<input …Run Code Online (Sandbox Code Playgroud)