this.form.reset（）がフォームアクションを実行しないようにするにはどうすればよいですか？

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

Aを使用し、入力type=imageを使用しないでください - タグをCSSの背景に追加します。

<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" />