web-dev-qa-db-fra.com

Comment faire en sorte qu'un bouton HTML se comporte comme un lien hypertexte?

Comment faire en sorte qu'un bouton HTML se comporte exactement comme un hyperlien où, si vous cliquez dessus, une fenêtre de navigateur affichant la page de votre choix s'ouvrira.

Je comprends cela beaucoup. Je pense que je vais utiliser cela, mais au lieu d'un lien vers du code javascript à l'intérieur des guillemets pour "onclick", je souhaite mettre quelque chose de simple pour lancer une nouvelle fenêtre de navigateur.

javascripthtmlonclick
15
xarzu

onclick et window.open

<input type="button" onclick="window.open('http://www.example.com','_blank','resizable=yes')" />
22
YOU
In Head:  
<script>
openNewWindow = function()
{
 window.open(url, "_blank");
};
</script>
In Body:    
<input type="button" onclick="openNewWindow()" >

Je préfère définir une fonction nommée openNewWindow () plutôt que de mettre le code dans la balise input. Ceci est pour l'organisation. Je vous recommande fortement de faire cela si vous envisagez de disposer de nombreux boutons pour ouvrir différentes fenêtres.

9
Warty

Je pense que c'est la meilleure solution pour vous.

Essayez ceci

<a href="http://www.stackoverlfow.com" target="_"><input 
type="button" value="Click Me"/></a>

Bonne codage !!

9
Ravia

Vous pouvez faire quelque chose comme ça:

window.open(url, "window-name", "menubar=no,innerWidth=600,innerHeight=600,toolbar=no,location=no,screenX=400,screenY=40");

Si vous attribuez un nom à la méthode open, le navigateur ouvre une nouvelle fenêtre. Le troisième argument définit l'apparence de la nouvelle fenêtre.

2
Kees de Kooter
<input type="button" value="Google"
       onclick="window.open('http://www.google.com', '_blank');" />
2
Josh Stodola

Je me rends compte que j'ai 7 ans de retard, mais j'avais un problème similaire et je pensais faire un commentaire à l'intention de ceux qui pourraient suivre.

Si vous utilisez Bootstrap, vous pouvez associer des noms de classe de boutons Bootstrap aux balises d'ancrage et leur donner l'apparence de boutons:

<a href="path/file.ext" class="btn btn-md btn-link">I Look Like A Button</a>

Bootstrap prend également en charge les tailles de base, y compris btn-sm ou btn-lg. Certes, tout le monde n'utilise pas Bootstrap, mais même dans ce cas, les styles par défaut sont gratuits, faciles à trouver et peuvent être copiés dans votre propre feuille de style, même si vous utilisez une présentation passe-partout personnalisée.

0
RalphTheWonderLlama