Question

我正在尝试为移动网站创建简单的按钮。我研究的越多，我发现的共识越少。这非常有效：

<a><button>text</button></a>

但代码验证失败。

元素＆＃34;按钮＆＃34;不得作为＆＃34; a＆＃34;的后代出现。元件

此：

<a><div>text</div></a>

也很好用并传递代码验证，但我讨厌div，因为你必须指定宽度，而且由于我的按钮文本是由数据库字段动态生成的，所以这很麻烦。

所以......我是否错误地编写了按钮标签？或者我应该忽略代码验证错误？

Answer 1

你在链接什么？使用<a>元素。请勿使用<button>。

您要提交表格吗？使用<button>元素，请勿使用<a>。

你想要一个只触发JavaScript的用户控件吗？确定上述两个选项中哪一个最适合when JavaScript fails并使用。然后用JS逐步增强。

应用CSS以使您选择的任何选择都符合您的要求。

Answer 2

如果它应该是一个按钮，即单击它会导致执行某些操作（可能通过JavaScript），然后使用<button>。

如果是链接，即点击它会转到另一个页面或当前页面中的其他位置：它具有href的有效值，然后使用<a>。< / p>

语义HTML非常重要。

Answer 3

这可能最终因为过于基于意见而被关闭（有多种方法可以做到），但至少我可以尝试提出一些我的意见背后的推理。

a标记在其背后具有某些功能行为。他们通常会修改URL，即使他们没有在任何地方导航，在JavaScript中你将不得不对抗他们的默认行为。你在大部分时间里使用它们的所有东西都是它们的造型。

如果您使用他们的href标签进行默认导航行为，那么我建议您编写<a class="myprefixButton">，并在.button上设置CSS样式，为其提供填充和圆角边框以使其看起来像按钮一样。

如果您要提交表单，请使用<button type="submit">，或者如果您只链接到JavaScript，请使用<button type="button">。最后一个绝对没有来自其他任何地方的继承行为，这使得它非常适合在JS中从头开始构建而无需取消任何内容。

最后，如果您使用JavaScript 提交表单，请使用<button type="submit">并在表单元素上收听“提交”事件。原因是，如果用户按Enter键，或者通过其他形式（如辅助功能工具包）提交，您也需要提交。