将搜索框中的输入附加到按钮 link

Question

我会尽量简短。 :)

我正在尝试在我的网站上实现一个按钮，它将我重定向到我指定的 URL + 用户正在寻找的内容。

我这里有一小段代码：

<html>
  <div class="search">
    <form role="search" method="get" id="search">
        <div>
            <input type="text" value="" name="tag_search" id="tag_search" />
            <input type="button" value="Cerca" onclick="window.location.href='https://mywebsite.com/'" />
        </div>
    </form>
  </div>
</html>

那是几乎工作。

唯一的问题是，如果用户在搜索框中输入 "Hello"，一旦您按下 "Submit" 按钮，它将始终搜索以下 URL：https://mywebsite.com/

如何将用户写入的内容附加到搜索框中，以便按钮将我重定向到：https://mywebsite.com/Hello？

谢谢大家！

Answer 1

将输入的值添加到 link

<html>
  <div class="search">
    <form role="search" method="get" id="search">
      <div>
        <input type="text" value="" name="tag_search" id="tag_search" />
        <input type="button" value="Cerca" 
          onclick="window.location.href='https://mywebsite.com/' + 
          document.getElementById('tag_search').value" />
      </div>
    </form>
  </div>
</html>

Answer 2

添加以下Javascript帮助

<script>
function goToSearch() {
    window.location.href= 'https://mywebsite.com/' + encodeURI(document.getElementById("tag_search").value)
}

</script>

那么你的HTML应该是这样的

<html>
  <div class="search">
    <form role="search" method="get" id="search">
        <div>
            <input type="text" value="" name="tag_search" id="tag_search" />
            <input type="button" value="Cerca" onclick="goToSearch()" />
        </div>
    </form>
  </div>
</html>

将搜索框中的输入附加到按钮 link

Append input from search box into button link

html

php

wordpress

button

hyperlink