javascript - 一种具有两个图像按钮的表单在只能按下一个按钮时发送按钮的两个值

Question

我正在尝试从表单发送数据，在此表单中有 2 个图像按钮。其中一个按钮保存数据，而另一个按钮将其发送到另一个表单。问题是，当我按下任一图像按钮时，“saveDaTa”和“saveData”值都会被发送。

这些隐藏的输入会通过我按下的任一图像按钮发送。

<input type="hidden" name="saveData" value="2">
<input type="hidden" name="sendData" value="3">

我检查了我使用var_dump得到的内容，并且两个变量都被发送了。

//var_dump($this->input->post(NULL, TRUE));
  'saveData' => string '2' (length=1)
  'sendData' => string '3' (length=1)

<td rowspan="2" align="center">
    <a href="javascript:void(0);" onclick="javascript:document.forms['form1'].submit();">
        <img src="<?php echo base_url(); ?>images/save.png" alt="Save Data" width="30" height="30" />
        <input type="hidden" name="saveData" value="2">
    </a>
    <br />
&nbsp;&nbsp;Save  

 <!-- The user pressed the icon to send the data so it will now have to save that the user decided to do this in the database a Boolean in the database  
still the view. -->

</td>
<td rowspan="2" align="center">
    <a href="javascript:void(0);" onclick="javascript:document.forms['form1'].submit();">
        <img src="<?php echo base_url(); ?>images/save.png" alt="Send Data" width="30" height="30" />
        <input type="hidden" name="sendData" value="3">
    </a>
    <br />
&nbsp;&nbsp;Send
</td>
</form>

Answer 1

当然，当发送表单时，所有隐藏的输入也会被发送。你可以简单地做到这一点:

<style>
.ibtn {
  border:none;
  padding:0;
}
.ibtn::-moz-focus-inner {
  padding: 0;
  border: 0
}
</style>

<form>
  <button class="ibtn" name="send" value="1"><img src="http://www4.dict.cc/img/but_speech.gif"></button>
  <button class="ibtn" name="send" value="2"><img src="http://www4.dict.cc/img/but_speech.gif"></button>
</form>

另一种选择是将两个表单分开，每个表单都有自己的数据。