HTML中，在没有表单的情况下使用按钮标签是否有效？

Question

HTML中，在没有表单的情况下使用按钮标签是否有效？

44

我刚刚注意到，SoundCloud 上的音轨“操作”按钮（例如喜欢、转发等）都是 HTML button 标签。此外，它们既不在表单内，也没有绑定到表单上（类似于HTML5），也不会提交表单（它们显然是通过 JavaScript 处理的）。这是有效的 HTML 吗？一个按钮可以存在而没有表单吗？或者这些按钮只是普通可点击的 div 元素？对于屏幕阅读器来说，这个做法有效/无效？

- ChuckE

5

通过验证器检查一下它，看看是否有错误。 - John Conde

很好的评论...文档还说按钮的类型必须设置，因为每个浏览器处理方式不同。Soundcloud也没有设置类型。我应该完全依赖验证器吗？ - ChuckE

不要完全依赖“验证器”来确定代码是否“有效”，而需进行其他检查。 - Sparky

2个回答

7

是的，很久以前就可以使用了。

来自 whatwg.org：

此元素可用于以下上下文：

需要使用短语内容的地方。

在ajax时代，大多数输入不仅通过提交表单发送。而且大多数按钮只是用于在单击时执行操作，同时使用可识别的小部件。

- Denys Séguret

如果按钮点击提交数据到服务器（比如，“喜欢”歌曲），那么我应该通过表单来完成。不仅如此，正如我在之前的评论中提到的，这些按钮没有类型。那它们算什么？而且我不同意这些特定的按钮是“短语内容”。 - ChuckE

1

我从文档中复制了一段内容，其中短语内容被定义。今天使用表单的原因不多，它主要会对提交的内容添加限制。表单元素大多是过时的遗留物。 - Denys Séguret

2

我不明白一个写着“喜欢”的按钮怎么能算作“文档的文本以及标记该文本的元素在段落内部级别上”。也许只是我自己的问题。说表单只强制约束就等于说用可点击的div和css做所有事情也可以。那我们为什么还要检查文档的有效性呢？ - ChuckE

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jukka K. Korpela · Accepted Answer

一个 button 元素可以出现在任何文本级标记允许出现的文档主体位置，该元素不需要与 form 元素有任何关联。目前权威参考是 HTML 4.01 规范，正式规则位于 DTD 中，但您可以使用 W3C 标记验证器快捷地检查文档是否有效。

当 button 元素没有与表单相关联时，它与 span 元素并没有太大的区别（默认情况下为块级），但是 button 具有特殊的默认呈现方式。浏览器和辅助软件也可能将 button 视为特殊元素，因此最安全的做法是只将 button 用于应该在单击时触发某些操作的元素。相反，这种元素通常最好使用 button 标记来表示，尽管您也可以通过其他方式创建外观类似按钮的元素（主要是图像或 CSS）。

在表单之外，button 元素的默认类型为 type=button （在这种情况下通常只有这种类型才是明智的）。这意味着它只能通过 JavaScript 生效。这并不会使其无效。但是，您可以考虑通过 JavaScript 生成此类按钮，而不是将它们作为静态 HTML 内容存在，以便在禁用脚本时，不会有一个（有效的，但）令人困惑的不起作用的按钮。

回答下方评论中的澄清问题： button type=button 元素类似于 input type=button；区别在于后者没有内容，但从 value 属性中获取显示在按钮上的文本，而 button 的内容可以是“丰富”的（带有标记）。无论使用哪个元素，如果它们会导致服务器执行操作（通常通过 Ajax 调用），那么我们确实可以询问在禁用 JavaScript 的情况下页面如何工作。但这个问题可能是不相关的（也许该页面本来就是应该运行 JavaScript 的应用程序），而且从正式上讲，这个想法并没有任何错误之处。

它们为什么存在？我认为是为了作者方便和遗留原因。同样，人们可能会问为什么 HTML 有事件属性，当它们无法在没有客户端脚本的情况下工作，你可以在 JavaScript 中为元素分配事件处理程序。但在早期，这是不可能的，即使现在，使用 button 元素或 onclick 属性比在 JavaScript 中完成任务（以及使用 CSS 将元素呈现为按钮）可能更加方便。此外，button 和 input type=button 会为元素创建与浏览器相关的外观，可以认为对于大多数用户，所有具有其默认按钮样式的样式都被视为按钮。