3

我需要使用 enter 键提交表单,但是,我必须使用 BUTTON 而不是 SUBMIT 作为类型,以使页面不刷新。我怎样才能让我的 BUTTON 充当 SUBMIT 并在有人按下他们的 enter 键时被执行?

<form>
<input type=text ...>
<input type=button ...>
</form>

我发现的很多关于此的信息都提到了 Netscape/IE/许多过时的材料。

这是我的 HTML 输出,我希望隐藏提交按钮并使用 ENTER:

http://i.stack.imgur.com/Ohepe.png

4

3 回答 3

3

启用 Javascript

<input type="button" onclick="this.form.submit()" ... /> 

应该管用

于 2011-08-04T19:32:14.643 回答
2

我必须使用 BUTTON 而不是 SUBMIT 作为类型才能使页面不刷新

不。使用submit刷新页面的普通按钮。(理想情况下,为了可访问性,让它工作!)然后添加渐进增强以在 JS 可用时用更流畅的东西替换表单的提交操作。在这种情况下,使用return false(或event.preventDefault()在 DOM 2 事件模型中)停止表单提交。

<form id="foo" method="POST" action="dosomething.script">
    ...
    <input type="submit" value="Do something"/>
</form>

document.getElement('foo').onsubmit= function() {
    beginAJAXSubmission();
    return false;
};

捕获submit表单的事件通常比尝试获取click按钮更好,因为它总是会在表单正常提交时触发,包括在 Enter 按键上。click在表单中的第一个提交按钮上通常会在 Enter 按键上触发,但是在某些情况下(取决于表单中的控件数量和它是什么浏览器)它不会发生,因此您最终可能会失败实际提交表单。

于 2011-08-04T19:38:30.610 回答
1

正如其他人所说,你必须使用Javascript。我推荐 JQuery 框架。

但我不明白刷新的事情?

通常的方法是点击提交,您的表单将通过请求发送到服务器。服务器处理数据并返回一个响应(HTML/JSon..etc)这个响应通常会被重定向到一个结果页面(以避免著名的关于刷新时重新发布的警告)。

现在,如果您的表单只是较大页面的一小部分,您可能希望使用 ajax 发布小表单,然后获取结果并更新您的 DOM。

综上所述,没有什么能阻止您对按钮使用提交类型,这实际上是使您的输入键默认为该操作的最佳方法。您所要做的就是使用 Jquery 并拦截表单的提交并进行 ajax 调用,而不是采用正常的方式。

你会发现很多使用 JQuery 的例子,因为它可能是最常用的 javascript 框架。

希望有帮助

于 2011-08-04T19:52:11.670 回答