Come sovrascrivere (disabilitare) il comportamento di "invio" di un tag pulsante all'interno di un tag form?

Question

<form action=""> 
    <button>click</button> 
</form>` 

Il comportamento predefinito di un pulsante all'interno di un modulo è di inviare tale modulo.

Come disattivare il comportamento di invio di quel pulsante?

Answer 1

Aggiungi un type="button" ad esso:

<button type="button">Click</button> 

---

I tipi availabe sono:

• "invia": Valore di default. Invia il modulo.
• "reset": reimposta gli input del modulo.
• "pulsante": non fa nulla.

Un buon riferimento: https://developer.mozilla.org/en/DOM/HTMLButtonElement

Answer 2

Questo disabiliterà tramite JavaScript

<button onclick='return false'>click</button> 

Ma si può semplicemente definire il tipo

<button type='button'>click</button> 

Answer 3

Ci sono occasioni in cui si desidera mantenere il sottigliezze di un pulsante submit (ad esempio, su un dispositivo mobile, dove ilIl pulsantepuò essere attivato dalla tastiera, ma solo se il pulsante è parte del modulo e di tipo submit. In questo caso, ciò che devi fare è impedire l'azione predefinita del pulsante.

utilizzando jQuery 1.7+ (usando .on - consiglio vivamente la lettura della documentazione - ci sono molte sfumature di utilizzare .on che può notevolmente influire sulle prestazioni)

$(document).on("click", "button", "event", function(evt) { 
    evt.preventDefault(); 
    ... 
} 

Usando le vecchie versioni di jQuery ...

$("#button-id").bind("click", function(evt, ui) { 
    evt.preventDefault(); 
    ... 
} 

si noti che è possibile utilizzare qualsiasi selettore (selezionare per classe, tipo di elemento ecc) o di un metodo di legarsi alla manifestazione (invece di .bind, utilizzare .live, .delegate come ap appropriato alla tua versione di jQuery.