我想知道有没有可能创建一个HTML搜索框,其中包含一个可由用户输入修改的超链接?例如
<form action="http://websitename.com/search=***the user's input text***">
<input type="text" placeholder="Search.." name="search">
<button type="submit">Search This Website</button>
</form>
如果这是可能的,上面的代码是执行这样一个功能的准确方式吗?我知道我需要一些基本的JavaScript,但这可能是什么样子,我需要添加/更改上面的html吗?提前感谢!
编辑这是确切的代码:
<form class="octopart-search">
<input type="text" placeholder="Search Octopart.." name="search" onchange="this.form.action='http://octopart.com/search?q='+this.value;return true;">
<button type="submit"><span class="glyphicon glyphicon-search"></span></button>
</form>
这是用户输入: 0201X103K250SNT
结果URL如下所示:http://octopart.com/search?search=0201X103K250SNT
当it 应该看起来像这样:http://octopart.com/search?q=0201X103K250SNT
不知何故,搜索“name=”被插入到了“q”应该出现的地方……
发布于 2018-08-04 07:14:58
如果您希望浏览器像识别搜索引擎一样识别此操作,请使用type="search"
,如下所示:
<form action="http://websitename.com/search">
<input type="search" name="q" placeholder="Search..." name="search">
<button type="submit">Search This Website</button>
</form>
<!-- When a user clicks submit, the link will look like
http://websitename.com/search?q=user_input -->
发布于 2018-08-04 05:17:47
在大多数情况下,如果您需要将搜索词作为HTTP参数进行传输,您可以直接执行此操作,而无需任何脚本:
<form action="http://websitename.com/search">
<input type="text" placeholder="Search.." name="q">
<button type="submit">Search This Website</button>
</form>
行为:只要用户按下submit按钮,浏览器就会跳转到URL=http://websitename.com?search=<user data>
。
相反,如果您需要将搜索词作为URI的一部分,您将需要一些脚本:
<form>
<input type="text" placeholder="Search.." name="search" onchange="this.form.action='http://websitename.com/search/'+this.value;return true;">
<button type="submit">Search This Website</button>
</form>
行为:只要用户按下submit按钮,浏览器就会跳转到URL=http://websitename.com/search/<user data>
。
更新
要获得像这样的http://octopart.com/search?q=<text>
,我强烈建议您使用第一种方法。
https://stackoverflow.com/questions/51679991
复制相似问题