在图像上单击提交表单

Question

我在一个表单中有多个图像.根据单击的图像,应使用POST发送特定值.

这可以不用javascript完成吗？(我使用jquery,如果没有).

我试过这样的事情:

<input type="image" name="type" value="1" src="images/type1.jpg" />

但只发送了图像的坐标,而不是type = 1.

Answer 1

解决此问题的安全方法是为输入提供唯一的名称,并查看哪一个发送坐标.

<input type="image" name="submit_blue" value="blue" alt="blue" src="blue.png">
<input type="image" name="submit_red"  value="red"  alt="red " src="red.png">

只有成功的控件才会发送任何数据.所以测试看是否submit_blue.x有值,然后测试是否submit_red.x有一个.

根本不需要涉及JavaScript.

或者,使用常规提交按钮而不是服务器端图像映射.

<button name="action" value="blue"><img src="blue.png" alt="blue"></button>

...请记住,这将破坏旧IE,因为它不能<button>正常支持.

Answer 2

使用 jQuery，您可以提交对图像的点击。您可以为图像甚至类添加一个 id。

$( "#yourImageId" ).click(function() {
  $( "#yourFormId" ).submit();
});