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

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元素的功能类似于并且可能类似于其类型设置为"图像"的BUTTON元素,但元素类型允许内容.

• 该BUTTON元素- W3C