Question

   $html .= '<div id="submit">  
 <input type="image" name="subscribe" onmouseover="this.src=\'images/1_hv.jpg\'" onmouseout="this.src=\'images/1.jpg\'"
src="images/1.jpg"
 value="'.$data["button"].'" onClick="return checkform();"></div>
<a id="cancel" href="'.getConfig("unsubscribeurl").'&id='.$id.'">'.$GLOBALS["strUnsubscribe"].'</a>
</form>
'.$GLOBALS["PoweredBy"];

为什么这个输入代码不能在IE下工作？当我点击IE下的图像时，它无法正常工作。它无法提交表格。也就是说，它无法订阅时事通讯。但在chrome和Firefox下可以。

当我把它改成

时

     <input type="submit" name="subscribe" value="'.$data["button"].'" onClick="return     checkform();">

在IE下，firefox，chrome。一切都可以。

Answer 1

这是因为您滥用<input type="image">来获得带有背景图片的按钮。 <input type="image">用作图像映射，您可以对按钮上鼠标指针的X和Y坐标感兴趣。这些值即作为请求参数发送。

在HTML / PHP术语中，

<input type="image" name="subscribe">

将以

的形式提供

$x = $_POST['subscribe.x']; // Contains X coordinate of mouse pointer on button.
$y = $_POST['subscribe.y']; // Contains Y coordinate of mouse pointer on button.

然而，在除了MSIE之外的现代浏览器上，按钮的“普通”名称和值也被发送，可能是为了在设计不佳的网站上更加宽容。

$subscribe = $_POST['subscribe']; // Contains "value" of button.

依赖服务器端的$_POST['subscribe']解释了为什么您的表单无法在MSIE上运行。

另请参阅w3 HTML规范的摘录：

17.4.1 Control types created with INPUT

...

图片

创建图形提交按钮。 src属性的值指定将装饰按钮的图像的URI。出于可访问性原因，作者应通过alt属性为图像提供替代文本。

当使用指点设备点击图像时，表单将被提交，并且点击坐标将传递给服务器。 x值是以图像左侧的像素为单位测量的，y值是从图像顶部开始的像素值。 提交的数据包括 name.x = x-value 和 name.y = y-value 其中“name”是name的值属性和 x值和 y值分别是x和y坐标值。

因此，要解决您的问题，您有两个选择：

检查是否存在subscribe.x和/或subscribe.y请求参数，以便采取相应措施（不推荐）。

不要滥用图片输入类型，唯一的目的是在按钮上有背景，只需使用CSS（更推荐）：

<input type="submit" id="subscribe" name="subscribe">

与

#subscribe { border: 0; width: 100px; /* Let it match the actual image's dimensions. */ height: 20px; /* Let it match the actual image's dimensions. */ background-image: url('images/1.jpg'); } #subscribe:hover { background-image: url('images/1_hv.jpg'); }

请注意，:hover伪选择器在<a>以外的元素上的IE6中不起作用，但我不希望您关心此浏览器。如果你这样做，那么请查看解决方案的JS角落。

为什么这段代码不能在IE下工作？

1 个答案:

17.4.1 Control types created with INPUT