HTML 输入（类型=图像）在 Firefox 4 上不起作用答案

【问题标题】：HTML Input (type=image) not working on Firefox 4HTML 输入（类型=图像）在 Firefox 4 上不起作用
【发布时间】：2011-06-19 12:34:46
【问题描述】：

<input  type="image"value="Delete" title="Delete" name="cmd_delete" src="bin/images/common/delete.png"/>

上面的 HTML 代码用于我的应用程序中的删除按钮。问题是这个按钮在 Firefox 4 中不起作用，但在其他浏览器中起作用。请问我该如何解决这个问题。

【问题讨论】：

究竟是什么不起作用？服务器端收到什么值？
您需要更好地描述什么不起作用。见jsfiddle.net/f672W
@不起作用的是服务器端代码。我有一个 php 函数，它检查图像字段的值是否已设置，然后执行某些操作。那是行不通的
@yankitwizzy - 你能提供整个表单标记吗？
@Jared Farrish pastie.org/2091653

标签： html input

【解决方案1】：

您基本上是在滥用<input type="image"> 来拥有一个带有背景图像的按钮。 <input type="image"> 表示图像映射。按钮上的鼠标位置作为cmd_delete.x 和cmd_delete.y 参数发送。但是您对鼠标位置不感兴趣。将其替换为普通的 <input type="submit"> 并使用 CSS 指定背景图像。例如

<input type="submit" name="cmd_delete" class="delete" value="" />

与

input.delete {
    background-image: url('bin/images/common/delete.png');
    width: 20px;
    height: 20px;
    border: 0;
    cursor: pointer;
}

并检查如下

if (isset($_GET['cmd_delete'])) {
    // Delete button pressed.
}

【讨论】：

@yan：如果你不想支持 IE6 也没关系。

【解决方案2】：

您可以使用<button name="cmd_delete" value=""><img src=".."/></button> 代替输入。

【讨论】：

【解决方案3】：

试试：

<input type="button" class=”button” value="Delete" title="Delete" name="cmd_delete" />

.button{
      background: url('bin/images/common/delete.png') no-repeat top;
}

【讨论】：

【解决方案4】：

以下在 IE、FF（和 IE6、BalusC！）中的作品：

<input type="submit" value="" style="background-image: url('bin/images/common/delete.png');width:262px;height:37px;border:0;cursor: pointer;" />

【讨论】：

我的 IE6-fail 评论与我自己的答案无关，而是 lonut staicu 的“最后一个答案”（目前已被接受）。

【解决方案5】：

假设：

<input type="image" name="submit" src="signout.png" />

如果您使用的是 php，请从

更改您的代码

if(isset($_POST['submit']))

到

if(isset($_POST['submit_x']))`

【讨论】：

【解决方案6】：

只需检查 $_REQUEST['submit_x'] 是否设置为空。使用输入类型图像时，旧浏览器不设置 $_REQUEST['submit']。真的不知道为什么...

那么就不需要对标签应用CSS了。

【讨论】：

【解决方案7】：

使用<button name="cmd_delete" value=""><img src=".."/></button> 的问题是您仍然可以看到图片后面的按钮。看起来很可怕。为什么这个投反对票……是真的，我试过了！

【讨论】：