Question

好的，这是我的问题。我正在为我的提交/重置表单按钮使用自定义图形，但是一旦按下重置，表单操作就会被提交，我不希望这种情况发生，我一直在网上搜索没有任何运气的答案。我也希望包括表格代码，因为我可能只是错过了一些东西。

<form class="contact" name="con_form" action="../includes/mailer.php">
            First Name*: <input type="text" name="first_name" value="" /><br />
            Last Name*: <input type="text name="last_name" value="" /><br />
            Contact Number*: (<input type="text" name="area_code" value="" size="3" />) <input type="text" name="first_three" value="" size="3" /> <input type="text" name="last_four" value="" size="4" /><br />
            Email Address*: <input type="text" name="email" value="" /><br />
            I would like to*: 
            <select>
                <option>--- Select One ---</option>
                <option>Comment</option>
                <option>Suggestion</option>
                <option>Inquiry for employment</option>
            </select><br />
            Comment or Suggestion: <textarea size="1024"></textarea><br /><br />
            <input type="image" src="images/sub_idle.gif" onsubmit="../index.php" alt="Submit" /> <input type="image" onclick="this.form.reset()" src="images/res_idle.gif" alt="Reset" />
        </form>

Answer 1

input type="image"将图像定义为提交按钮。如果您只是想让它成为触发某些javascript的可点击图片，则根本不需要将其设为input。

Answer 2

<input type="image"输入实际上是一个提交按钮

我会尝试这个作为起点:(不是最好的方式）

<img onclick="this.form.reset();" src="images/res_idle.gif" alt="Reset" />

Answer 3

请勿使用输入type=image，请使用带有CSS背景的A - 标记。

<a href="#" class="buttonImage" onclick="document.con_form.reset();return false"></a>

.buttonImage {
    background-image:url(/images/sub_idle.gif);
    height:20px;
    width:60px;
    display:block
}

Answer 4

您可以将类型更改为“按钮”，并将css类应用于按钮以自定义按钮。

<input type="button" onclick="this.form.reset()" class="resetbutton" />

如何阻止this.form.reset（）触发表单操作？

4 个答案: