<form action="">
<button>click</button>
</form>
The default behaviour of a button inside a form is to submit that form.
How can I disable the submit behaviour of that button?
Add a type="button" to it:
<button type="button">Click</button>
The types availabe are:
A good reference: https://developer.mozilla.org/en/DOM/HTMLButtonElement
This will disable via javascript
<button onclick='return false'>click</button>
But you can just define the type
<button type='button'>click</button>
There are occasions where you want to keep the niceties of a submit button (for instance, on a mobile device, where the submit button can be triggered from the keyboard, but only if the button is part of the form and of type submit). In this case what you need to do is prevent the default action of the button.
Using jQuery 1.7+ (using .on - I highly recommend reading the documentation - there are many nuances to using .on that can vastly affect performance)
$(document).on("click", "button", "event", function(evt) {
evt.preventDefault();
...
}
Using older versions of jQuery...
$("#button-id").bind("click", function(evt, ui) {
evt.preventDefault();
...
}
Note that you can use any selector (select by class, element type etc) or an method of binding to the event (instead of .bind, use .live, .delegate as appropriate to your version of jquery.