Append 从搜索框输入到按钮链接

Question

I'll make this short and quick.我会让这个简短而快速。 :) :)

I'm trying to implement a button on my website, which redirects me to a URL I specify + what the user is looking for.我正在尝试在我的网站上实现一个按钮，它将我重定向到我指定的 URL + 用户正在寻找的内容。

I have this little piece of code here:我在这里有一小段代码：

<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>

that is almost working.这几乎可以工作了。

The only thing is that if the User inputs "Hello" in the Search Box, it will always search for the following URL once you press the "Submit" button: https://mywebsite.com/唯一的问题是，如果用户在搜索框中输入“你好”，一旦按下“提交”按钮，它将始终搜索以下 URL： https://mywebsite.com/

How can I append what the User has written into the Search Box, so that the Button will redirect me to: https://mywebsite.com/Hello ?我怎样才能 append 用户写入搜索框中的内容，以便按钮将我重定向到： https://mywebsite.com/Hello ？

Thank you all!谢谢你们！

Answer 1

Add the value of the input to the 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

Add the following Javascript to help添加以下 Javascript 帮助

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

</script>

Then your HTML should look like this那么你的 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>

Append 从搜索框输入到按钮链接

问题描述

2 个解决方案

解决方案1
2 已采纳 2020-06-12 16:45:26

解决方案2
1 2020-06-12 16:46:06

Append 从搜索框输入到按钮链接

问题描述

2 个解决方案

解决方案1 2 已采纳 2020-06-12 16:45:26

解决方案2 1 2020-06-12 16:46:06

解决方案1
2 已采纳 2020-06-12 16:45:26

解决方案2
1 2020-06-12 16:46:06