Comment créer un bouton Cancel HTML qui redirige vers une URL

Je joue avec les boutons dans l'éditeur de Tryps de w3schools , et j'essaie de comprendre comment faire mon navigateur redirection vers une URL lorsque je clique sur le bouton "Annuler".

Voici ce que j'ai essayé:

<form action="demo_form.asp" method="get"> First name: <input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br> <button type="submit" value="Submit">Submit</button> <button type="reset" value="Reset">Reset</button> <button type="cancel" onclick="javascript:window.location='http://stackoverflow.com';">Cancel</button> </form> 

Mais cela ne fonctionne pas. Des idées?

cancel n'est pas une valeur valide pour un attribut de type, donc le bouton est probablement en défaut de submit et de continuer à soumettre le formulaire. Vous voulez probablement dire type="button" .

(Le javascript: devrait être supprimé cependant, alors qu'il ne fait aucun dommage, c'est une étiquette entièrement inutile)

Vous ne disposez toutefois d'aucune fonctionnalité de type bouton, donc serait mieux avec:

 <a href="http://stackoverflow.com"> Cancel </a> 

… éventuellement avec certains CSS pour faire ressembler à un bouton.

Il n'y a pas de button type="cancel" en html. Vous pouvez essayer comme ça

 <a href="http://www.url.com/yourpage.php">Cancel</a> 

Vous pouvez faire ressembler à un bouton en utilisant des propriétés de style CSS.

Il y a quelques problèmes ici.

Tout d'abord, il n'existe pas <button type="cancel"> , donc il est traité comme un simple <button> . Cela signifie que votre formulaire sera soumis, au lieu du bouton qui vous emmène ailleurs.

Deuxièmement, javascript: n'est nécessaire que dans les href ou action attributs d' action , où une URL est attendue, pour désigner le code JavaScript. À l'intérieur d' onclick , où JavaScript est déjà prévu, il sert simplement d'étiquette et ne sert à rien.

Enfin, il est généralement préférable d'avoir un lien d' annulation plutôt qu'un bouton d'annulation. Vous pouvez donc faire ceci:

 <a href="http://stackoverflow.com/">Cancel</a> 

Avec CSS, vous pouvez même faire ressembler à un bouton, mais avec ce HTML, il n'y a absolument aucune confusion quant à ce qu'il est censé faire.