Home / Questions / 143322
Accepted
Sergio AG
Asked: 2020-03-05 15:57:12 +0800 CST 2020-03-05 15:57:12 +0800 CST

HTML button that sends you to another page

  • 772

How can I make a button that sends me to another page that I specify? So far I've only been able to do it with the tag <a>and its href and target attributes. But I can't do it with a <button>.

html

5 Answers

  1. Best Answer

    You can do it like this:

    <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <style>

  </style>
</head>
<body>
<button onclick="location.href='https://www.facebook.com'">Llévame a otro lado</button>
</body>
</html>

    You don't occupy anything in the a tag, but thanks to location.href it tells you the address you want to reach

    • 9

  2. Try adding target="_blank"to a tag<a>

    a{
  border-radius: 5px;
  padding: 10px 7px;
  text-decoration: none;
  color: #fff;
  background-color: #333;
  margin: 5px;
}
    <a href="https://es.stackoverflow.com" target="_blank">Mi boton</a>

    • 1

  3. What I do is the following:

    <a href="destino.php"><input type="button" value="Ir"></a>

    I don't know if it will be the best way, but it works for me.

    • 1

  4. Here I leave you another way to do the redirection;

    .button{
height:30px;
width:50px;
background-color:floralwhite;
border-radius:10%;
 }
    <button name="redirect" class="button" onClick="redirect()">
Click
</button>


    <script type="text/javascript">
    function redirect()
    {
   
    window.location.href="https://programminghead.com/submit-button-redirect-to-another-page-in-html/";
    }
    </script>

    We use a small JavaScript function to do the URL redirection.

    As you have seen there are different ways to do it, this example that I have shown you can help you to be more efficient, for example, if you have to change the redirection eventually and you have different buttons on your website. To avoid searching the HTML code, create a small JavaScript file that contains the redirections, when you have to change them, you already have everything in the same document.

    • 0

  5. I don't know if the answer is a bit late. But I consider from your question that you are an apprentice, therefore the ideal would be a code like this:

    <a href="**pagina a redireccionar.php**" class="subir">**Texto del Boton**</a>
    • -1