link onclick 与按钮 onclick

link onclick vs. button onclick

这是一个相当简单的辅助功能问题。

假设我们有一个开关 link/button，点击它会切换移动菜单。对于这样的按钮，哪种格式更易于访问？

我们总共有 4 个选项，由

分隔

button 标签对比
a 标签，

和

onclick 属性对比
$("#showMenu").on("click", function() { showMenu() } )

所有选项

<a href="#" onclick="showMenu();"></a>
<button onclick="showMenu();"></button>
<a href="#" id="showMenu"></a>
- 和$("#showMenu").on("click",function() { showMenu() } );
<button id="showMenu"></button>
- 和$("#showMenu").on("click",function() { showMenu() } );

优缺点

我读到，为了获得最佳的可访问性，<button> 标签应该用于 javascript 操作，<a> 标签应该用于正常的 links。很遗憾，我再也找不到那篇文章了。

人们总是说 "separate logic from content"。我的回答是：你真的认为你的 Javascript showMenu() 函数在没有 link 触发的情况下会起作用吗？那么，您真的将逻辑与内容分开了吗？

沿着这些思路，我确实喜欢使用事件处理程序来附加事件的想法，但是，这使得代码在某些情况下更难维护，而不是更容易。如果我稍后删除 link 或更改 ID 或 class，我将失去该功能。 onclick 属性提醒我要小心行事。如果我有多个 link，或者希望符合 508（见下一段），我将使用事件处理程序。

508 标准要求每个 onclick 属性都伴随有等效的键盘属性。这让我抓狂，因为键盘用户可以通过按键触发 onclick 事件，并且习惯于对文本 links 这样做。* 此外，如果您添加任何类型的 onkeyup 事件处理程序，您需要过滤密钥等，这样用户就不会在您的 link 上获得 "stuck" 并变得完全无法浏览网站的其余部分。

*见注释：http://alistapart.com/article/popuplinks#section6

我的问题

<button> 标签是否更利于辅助功能？
为什么或为什么不？
这 4 个中哪一个最适合无障碍访问？

请注意，此问题与以下问题类似，但我对 <button> 与 <a> 的论点更感兴趣。另外，以下问题甚至没有提到可访问性，这是我主要关心的。 jQuery.click() vs onClick

其中很多是见仁见智的事情，但对我来说，link 会将您带到某个地方，而按钮会执行一个操作。就您而言，如果是我，我会使用按钮。正如您提到的那样，我会使用 onclick 来避免以后忘记它。

所以你的选择#2。

"Keep it simple ... ask your customers!"

我个人认为，当您想要 "do something," 时，您应该使用按钮。（HTML 按钮的键盘快捷键不需要额外的代码...）

如果您想“去某个地方”，那是超链接的（唯一）正确位置。

我不希望 "button" 带我去某个地方，我也不希望 "hyperlink" 做某事。

link onclick 与按钮 onclick

link onclick vs. button onclick

html

jquery

section508

onclick