<button>与<input type ="image">

Ste*_*art 11 html accessibility

这是一个"添加到篮子"控件,我的一位同事设计了一个漂亮的图形.显然它应该生成一个post请求,一个简单的超链接不会这样做.

亚马逊使用图像输入实现了它.但是有什么利弊

<input type="image" src="atb.png" alt="Add to Basket" />
Run Code Online (Sandbox Code Playgroud)

<button type="submit"><img src="atb.png" alt="Add to Basket" /></button>
Run Code Online (Sandbox Code Playgroud)

(并使用CSS来控制外观)?

我想这归结为这些问题:

  • 是否所有的图形和非图形浏览器都能成功实现键盘可访问的图像输入?(或者,对于无键盘设备,无论输入方式是什么,都可以访问它们?)

  • 哪些浏览器不支持<button>

  • 各有哪些优点/缺点?

  • 有没有其他可能的方法有自己的优势(除了忘记它,只是使用简单的提交)?

ede*_*ett 2

它们应该是等价的。出于样式目的,我发现如果您将来进行更改,按钮标签会更加灵活。

但是: IE 有一个错误/功能,其中按钮或输入的值设置为等于innerHTML。如果您的服务器端代码需要这是一个特定值,这可能会导致问题。

<button>除非您需要go with额外的样式灵活性<input type="image">,否则您不需要处理 IE 的怪癖。