Question

我在页面上有几张图片。每个图像都分配了一个id值。我需要获取图片ID，将其传递给表单并在单击图像时提交该表单。

<IMG SRC="img1.gif" id="var1">
<IMG SRC="img2.gif" id="var2">

<form method="post" id="myForm" action="thisPage.php">
<input type="hidden" name="myID">
</form>

如何将图像中的值传递给表单？

现在，我知道我可以在jQuery中使用ajax，但在这种情况下，我实际上需要提交到此页面并在提交后重新加载。

Answer 1

<script type="text/javascript">
function setImage(imgid) {
  document.getElementById('formImage').value = imgid;
  document.getElementById('myForm').submit();
}
</script>

<IMG SRC="img1.gif" id="var1" onclick="setImage('var1');" />
<IMG SRC="img2.gif" id="var2" onclick="setImage('var2');" />

<form method="post" id="myForm" action="thisPage.php">
<input type="hidden" id="formImage" />
</form>

Answer 2

javascript解决方案

<IMG SRC="img1.gif" id="var1" onclick="setid(this.id)">

function setid(id)
{
  document.getElementById('myID').value=id;
  document.forms[0].submit();
}

Answer 3

你仍然可以在没有ajax的情况下使用jQuery。

$(function() {
    $('img').click(function() {
        $('[name=myID]').val($(this).attr('id'));
        $('#myForm').submit();
    });
});

看演示。 http://jsfiddle.net/gwgCH/3/

将图像ID传递给表单并使用jQuery提交

3 个答案: