javascript - 在js中不使用htaccess将搜索从/?s=searchterm更改为/searchterm

Question

我正在尝试使用下面的搜索表单和 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，因为我已经设置了规则。

Answer 1

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

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

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

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

额外注意:您真的应该用 <button/> 替换您的提交脚本，比如:

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

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

我假设您的问题只是关于代码的客户端，并且您已经想出了如何让服务器端代码从 URI 路径读取值。弄清楚如何读取值(如果以这种方式提交)将花费我一些时间进行研究，并且需要有关服务器端设置的更多信息。