php - html 表单正在重置按钮上发送

Question

我的 html 表单有问题。

这是我的代码：

<form name="contactform" method="post" action="send_form_email.php">
  <input id="first_name"  type="text" name="first_name" size="30"/>
  <input id="company_name"  type="text" name="company_name" size="30"/>
  <input id="email"  type="text" name="email" size="30"/>
  <input type="image" align="middle" src="images/accept.png" alt="Submit" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input id="reset" type="image" src="images/reset.png" alt="Reset" align="middle" />
</form>

当我单击这些图像中的任何一个时，我的表单就会被发送。如何使此重置图片仅重置而不发送表单。

Answer 1

您的重置按钮不是重置按钮。它有type="image"，它是服务器端图像映射。

当您单击服务器端图像地图时，表单将被提交，您单击的坐标将包含在数据中。

如果您想要一个作为图像的重置按钮，请使用：

<button type="reset"><img src="..." alt="..."></button>

Answer 2

图像类型就像一个提交按钮。

您必须type="reset"使用 css 为您的按钮设置样式。

Answer 3

采用

<input type = "reset" value = "" class = "btnResetClass" />

您的 btnResetClass 将具有由您设置的背景图像的 Css 设置。

Answer 4

你必须使用type="reset".

这个 jsFiddle 例子会更好。

HTML:

<form id="contactform" method="post" action="send_form_email.php">
    <div>
        <label>
            First Name: <input id="first_name" name="first_name" type="text" size="30" />
        </label>
    </div>
    <div>
        <label>
           Company Name: <input id="company_name" name="company_name" type="text" size="30" />
        </label>
    </div>
    <div>
        <label>
            Email: <input id="email"  type="text" name="email" size="30" />
        </label>
    </div>
    <input id="submit" type="submit" value="" title="Submit" />
    <input id="reset" type="reset" value="" title="Reset" />
</form>

CSS:

#submit, #reset {
    border: none;
    width: 64px;
    height: 48px
}
#submit {
    background: url('images/submit.png')
}
#reset {
    background: url('images/reset.png')
}