Fill external website URL with typed data

Asked

Viewed 23 times

0

I need to create a code, in HTML as simple as possible, where a person types a certain string and clicks a button.

With this, a URL with this string is opened in a new tab (example.com/string).

I’m starting to study now and, for now, I’ve managed to get to that:

<form>
  <label for="dadopesquisado">Digite aqui:</label>
  <input type="text"  id="texto" name="texto"><br><br>
  <input type="submit" value="Pesquisar">
</form>

  • 1

    "I need to create a code" and what have you been able to do? asks the question

  • I am beginner and I managed to do only this rsrs

  • Do you already have a source site? Because apparently the user will not have to type "https://..." will only pass the string as a parameter to some url, what is it? Because I can answer the question but if it gives the URL in which the string will be passed as a parameter to it, is easier because then you can test and see working.

  • Well, I wanted a word search to be directed to a dictionary. It could be https://www.dicio.com.br/.

1 answer

0

Maybe the code below is what you’re trying to implement:

<body>
  <form>
    <label for="dadopesquisado">Digite aqui:</label>
    <input type="text" id="dadopesquisado" name="texto"><br><br>
    <button>Pesquisar</button>
  </form>

  <script>
    //Cria uma variavel que aponta para o botão
    const button = document.querySelector("button");

    //Adiciona um evento toda vez que o botão for clicado
    button.addEventListener("click", (e) => {

      //Previne que o corportamento padrão de reiniciar a pagina aconteça
      e.preventDefault();

      //Pega o texto escrito no input
      const dataToUrl = document.querySelector("#dadopesquisado").value;

      //Abre a nova guia no endereço base + texto do input
      window.open("https://www.dicio.com.br/" + dataToUrl);
    })
  </script>
</body>

Explanation: You’re new to the front so you need to learn some important things. HTML is not code, to program on web pages we need to use Javascript. This language is inside the tag script in the HTML snippet I sent above.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.