1

我正在尝试使用下面的搜索表单和 js 来搜索我的网站。但是，每当您在表单中键入一个单词并单击提交表单时，他们会将用户浏览器带到http://example.com/?s=searchterm，但我希望它把他们带到http://example.com /searchterm并完全省略字符 ?s=

<script type="text/javascript">
function submitform()
{
    document.forms["searchsite"].submit();
}
</script>
<form id="searchsite" action="/">
<input type='text' name='s' placeholder='search'>
<a href="javascript: submitform()">Submit</a>
</form>

有什么积极的建议吗？顺便说一句，不，我不相信我可以使用 htaccess 和 mod_rewrite，因为我已经设置了规则。

4

2 回答 2

3

您可以设置一个onsubmit处理程序来拦截表单的提交，并将默认操作替换为设置位置 href。这依赖于在客户端启用的 JavaScript：

<form id="searchsite" action="/" onsubmit="javascript:location.href=this.action + encodeURIComponent(this.elements.namedItem('s').value); return false;">

这会转义搜索词，以便如果用户在其中输入内容?，/服务器会将其解释为路径的一部分，而不是认为客户端正在尝试发送查询字符串或访问某个子目录。由于处理程序已经更新，return false;浏览器应该停止其正常的表单提交过程，这将导致浏览器在处理程序返回后立即开始导航。onsubmitlocation.hrefonsubmit

但是，您确实应该使用服务器端代码对此进行补充。对于这么简单的事情，JavaScript 可以在跳过 HTTP 重定向的同时使您的 URI 更漂亮（这样浏览器会比其他方式稍微快一点地直接转到请求的页面）。但是你真的应该有一个服务器端重定向，只要s发送 GET 参数就会触发。

额外说明：你真的应该用 替换你的提交脚本<button/>，比如：

<button type="submit">Submit</button>

并完全删除您的<a/>和<script/>标签。通过覆盖表单提交处理程序本身，您可以获得所需的所有功能，无需尝试拦截按钮单击等。通过此更改，您的表单现在应该在用户按下 ENTER 时工作，而不是要求用户按 TAB 键<a/>. 将预期的 HTML 元素用于预期目的并挂钩正确的事件；-)。

我假设您的问题仅与代码的客户端有关，并且您已经知道如何让服务器端代码从 URI 路径中读取值。弄清楚如何读取值，如果以这种方式提交，我需要一些时间来研究，并且需要有关您的服务器端设置的更多信息。

于 2013-06-29T02:44:10.487 回答
1

无需提交表单，而是构建 URL，然后设置位置。您可以将 ID 添加到搜索词（s在本例中），然后简单地构建 URL：

var searchTerm = document.getElementById("s").value;
document.location = "http://example.com/" + searchTerm;
于 2013-06-29T02:41:06.253 回答