Image 输入类型=ie和opera未发送的图像名称和值

当一个表单有多个图像输入，服务器端使用它们的名称和/或值来区分单击的是哪一个时，它在FireFox中工作得非常好。然而，人们通常在发现HTML指定不发送任何内容之前就编写了整个过程，因此一些浏览器不发送它

它不是关于发送任何随机对象，而是作为

input\u name=input\u value

发送一对。这里最好的最坏情况示例是我遇到的：一个元素列表，所有元素都以一种形式出现，并且都带有带有

name=“delete”value=“”

---

如何解决此问题？

到目前为止，问题已解决一半：

但它不允许获得价值

正确答案是：

$('input[type=image]')
.unbind('mousedown')
.mousedown(function(){ 
  $(this).after('<input type="hidden" name="'+$(this).attr('name')+'" value="'+$(this).attr('value')+'" />'); 
});

$（'input[type=image]'））
.unbind（'mousedown'）
.mousedown（函数（）{
$（本）。在（''）之后；
});

当用户开始单击输入时，此代码将创建该输入的隐藏副本。unbind（'mousedown'）是为了确保它只发生一次，即使您将代码放在一个奇怪的应用程序中的多个位置，并且它可能会被多次调用

我建议把它放在

$（document）.ready（）中
根据，单击图像输入将返回参数：

name.x=x-value和name.y=y-value，其中“name”是name属性的值

具有与单击位置对应的x值和y值

当然，处理此问题的服务器代码会有点烦人，但您可以使用正则表达式检查所有查询参数键：

/^(.*)\.[xy]$/

搜索
图像
输入键以确定单击了哪个
图像。
我尝试了以下示例：

<form action="#" method="GET">
  <input type="text" name="t" value="Text here"><br>
  <input type="image" name="a" value="1" src="http://sstatic.net/so/img/logo.png"><br>
  <input type="image" name="b" value="2" src="http://www.gravatar.com/avatar/c541838c5795886fd1b264330b305a1d?s=32&d=identicon&r=PG"><br>
</form>









我得到以下网址：


FF 3.6:x.html？t=Text+here&b.x=19&b.y=17&b=2#
IE 8:x.html？t=Text+here&b.x=22&b.y=18
IE 7:x.html？t=Text+here&a.x=185&a.y=51
Opera 10:x.html？t=Text+here&a.x=107&a.y=53#
Chrome:x.html？t=Text+here&b.x=20&b.y=17&b=2#

因此，似乎所有浏览器都在发送与图像相关的内容，即使它不是直接的图像名称。因为您需要扫描所有希望看到的图像名称，所以您可以只扫描imagename.x
 我想我也有类似的问题。我想点击一个缩略图并将其放大到另一个页面上。我曾试图单独使用PHP来实现这一点，但最终不得不将标记用于。对于FF3和safari来说效果很好，但是对于IE9或FF9，输入的图像值没有发布。
我的工作是将每个图像以其自身的形式放置，然后使用隐藏的输入发送所需的数据

<table>
   <tr>
     <td>
        <form method="post" class="form_photo">
            <input type="image" name="img_photo" value="does nothing in IE9 or FF9" />
            <input type="hidden" name="photo" value="nameoftheimage.jpg" />
        </form>
        <form method="post" class="form_photo">
           <input ...>
           <input ...>
        </form>
        <form> ...
  </td>
</tr>

似乎已经解决了垂直问题。现在，用户可以单击缩略图，该值现在在我有权测试的所有浏览器中传递。
使用type=“image”是有问题的，因为传递值的能力由于一些愚蠢的原因而被禁用。无论如何&尽管它不是那么可定制的&因此也很漂亮，但只要它们是type=“button”的一部分，您仍然可以使用您的图像


我希望这可以节省一些人重写其他人代码的时间。如果JavaScript不可用，这会中断。哦，请。。。禁用javascript时，不会更改任何内容，也不会中断任何内容。我提出了这个问题，马上回答了。我只是想为有同样问题的人发布一个解决方案，因为在这个话题的讨论中没有提到。现在你们让我想删除它。我试图帮助人们处理像我正在处理的应用程序接口这样设计不良的应用程序接口，这会让你感到烦恼吗。JS不是一个美容美甲。这不是一个可用性增强。它的全部目的是向表单提交中添加数据，而服务器端脚本（写得不好）需要这些数据，并且默认情况下并非所有浏览器都发送这些数据。如果它不运行，数据就不会发送到服务器，也不会工作。那是“有东西”和“坏了”。我不明白这里的反对票。这确实是解决问题的好办法+1我会注意到，这个问题在Internet Explorer中只会引起注意。这是我在半解决方案链接中的答案。问题是关于名字和价值。如果不是，它将是一个复制品question@naugtur：我想进一步澄清你的问题。现在它说的是“名称和/*或*值”，你说的是检测点击了哪个图像。。。从我的阅读方式来看，这意味着这个答案是完全正确的（根据html规范，这是一种“正确”的方式，而且它在没有javascript的情况下也能工作）。@naugatur：值得注意的是，“name”和“value”之间有一对一的映射。根据您的应用程序，从查询字符串中捕获“名称”并使用该名称推断服务器上的“值”可能就足够了，因为“值”不可由用户更改。对如果您有这些表单的通用处理程序，那么这种方法会有一些问题（因此从名称推断值是不合适的）。。。但它可能适用于某些应用程序如果您想区分输入，可以为它们指定唯一的名称，即
name=“foo”value=“bar”
变成
name=“foo\u bar”value=“bar”
。然后，您可以在服务器上执行以下操作：
foreach my$key（keys%params）{if（$key=~/^foo.+\.y$/）{$value=$1；}}
I加粗了一个重要事实，即它与发送内容无关。此外-我链接到一个外部解决方案，上面说image.x和image.y已经发布了。@naugtur：规范没有按照您希望的方式工作。你要做的最简单的事情就是根据规范对你的应用程序进行编码。点击哪个按钮可以通过查看参数列表轻松检测到。你可以用javascript来伪装它，但如果你不这么做，它会更简单。我开始希望我没有发布它。。。
.form_photo { display:inline; }

<button type="submit" name="someName" value="someValue"><img src="someImage.png" alt="SomeAlternateText"></button>