1. 程式人生 > >Form is submitted when I click on the button in form. How to avoid this?

Form is submitted when I click on the button in form. How to avoid this?

原來button 沒加 type 屬性,會變成 submit @[email protected];

太久沒寫網頁,這個變化真大。

button element with no type attribute specified represents the same thing as a button element with its type attribute set to “submit”.

The HTML4 spec says the same thing:

type = submit|button|reset [CI]
This attribute declares the type of the button. Possible values:

  • submit: Creates a submit button. This is the default value.
  • reset: Creates a reset button.
  • button: Creates a push button.

So your <button> elements:

<button class="btn">Button_1</button>
<button class="btn">Button_2</button>

are the same as these (in compliant browsers):

<button type="submit" class="btn">Button_1</button>
<button type="submit" class="btn">Button_2</button>

and any time you hit one of those buttons you’ll submit your form.

The solution is to use plain buttons:

<button type="button" class="btn">Button_1</button>
<button
type="button" class="btn">Button_2</button>

Some versions of IE default to type="button" despite what the standard says. You should always specify the type attribute when using a <button> just to be sure that you will get the behavior you’re expecting.