2

我有一些使用提交按钮的表单,如下所示: <input type="button" onclick="validateAndSubmit()">

它们工作正常,但可访问性检查器说表单中没有提交按钮,因为没有。

我知道 type="button" 清楚地表明它充当按钮,但我不知道如何在不实际使用 type="submit" 的情况下向辅助技术表明它专门充当提交按钮。(我宁愿不使用实际的提交按钮,因为意外的 javascript 错误会提交表单。当然你可以捕获错误,从这个意义上说它不那么健壮,我想知道是否还有其他方法。)

是否有 ARIA 角色或其他技术可以清楚地表明按钮提交表单(假设一切都验证)?

4

3 回答 3

4
<button type="submit" onclick="validateAndSubmit()">Submit</button> 

应该做的伎俩。button在这种情况下不需要 ARIA 角色 ( ),因为button这里使用了 HTML 规范中定义的角色。

于 2017-07-28T15:53:28.213 回答
2

我不同意现有的两个答案。

确实,在表单中拥有提交按钮并不是一项义务。但是,如果要提交您的表单,则必须有一个提交按钮

您的按钮的弱点<input type="button" onclick="validateAndSubmit()">是您确实必须单击此按钮才能触发功能并提交表单。

但是,它通常很有用,并且大多数用户期望,当在任何字段中按下 enter 时提交表单,不一定是提交按钮。典型用例:输入您的电子邮件、选项卡、输入密码,然后直接按 Enter 键登录,而不是用鼠标单击“登录”或再按一个选项卡并输入。

您的虚假提交按钮不允许这样做。您应该将其替换为真正的提交按钮并在表单 ( )<input type="submit" />上使用提交事件。<form onsubmit="...">

如果您的问题是意外的 JavaScript 错误导致提交的表单输入错误,请不要忘记您必须再次检查输入服务器端。以防万一,event.preventDefault()如果您通过 AJAX 提交并且不确定您的代码永远不会触发错误,则完全允许您使用 try...catch...finally 并在 finally 子句中执行;这不是一个糟糕的防御性编程解决方案。

于 2017-07-30T08:29:25.927 回答
0

Form元素不需要有submit按钮。没有这样的义务。

您使用的可访问性检查器对此是错误的。

W3C 在其文档中使用了一些没有提交按钮的表单示例:

最后,为了使表单可提交,我们使用按钮元素:

于 2017-07-28T13:45:01.883 回答