Question

嘿，我有这种形式

    <form method="POST" action=''>
<input type="hidden" name="op" value="download1">
<input type="hidden" name="usr_login" value="<TMPL_VAR usr_login>">
<input type="hidden" name="id" value="<TMPL_VAR file_code>">
<input type="hidden" name="fname" value="<TMPL_VAR file_name>">
<input type="hidden" name="referer" value="<TMPL_VAR referer>">
<div class="premium-download"><input name="method_premium" value="<TMPL_VAR lang_premium_download>" type="image" src="images/premium-download.png" alt="<TMPL_VAR lang_premium_download>" border="0" /></div>
<div class="free-download"><input name="method_free" value="<TMPL_VAR lang_free_download>" type="image" src="images/free-download.png" alt="<TMPL_VAR lang_free_download>" /></div>
</form>

如何从图像输入中提交表单（请参阅最后两个字段）？现在他们被设置为图像类型，我知道那些默认情况下不会提交表单。有人可以帮忙吗？有人告诉我用javascript：D

Answer 1

我最初误解了你的问题。如前所述，<input type="image">元素执行提交表单。但是，如果您正在寻找比图像输入更多功能，我的答案仍然适用。

我被告知用javascript
来做

请勿使用<button>元素。 <button>元素的工作方式与<input type="button">类似，不同之处在于它们可以设置为没有边框，透明，并且可以包含其他HTML。例如：

<button type="submit" name="method_premium" value="<TMPL_VAR lang_premium_download>">
  <img src="images/premium-download.png" alt=alt="<TMPL_VAR lang_premium_download>" />
</button>

使用CSS（border:none; background-color:transparent;）设置按钮样式，你就可以了。

使用BUTTON元素函数创建的按钮就像使用INPUT元素创建的按钮一样，但它们提供了更丰富的渲染可能性：BUTTON元素可能包含内容。例如，包含图像的BUTTON元素的功能类似于并且可能类似于INPUT元素，其类型设置为“image”，但BUTTON元素类型允许内容。

The BUTTON Element - W3C

Answer 2

“type”设置为“image”的输入元素确实（几乎）完全像“submit”输入。这几乎完全是因为你也得到了鼠标点击的坐标，你不获得输入元素的“值”。

如果您希望点击“图片”输入提交值，最简单的方法就是拥有更多隐藏的输入。

Answer 3

我不知道您要实现的目标，但您可以使用JavaScript提交表单。最好按照@Andy E的建议使用BUTTON：

<form method="POST" name='myForm'>   
...
...


<script lang="javascript">
function SubmitForm()
{
  document.forms['myForm'].submit() ;
}
</script>

Onclick使用图像按钮提交表单Javascript

3 个答案: