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路径读取值。弄清楚如何读取值，如果以这种方式提交，将花费我一些时间进行研究，并需要有关服务器端设置的更多信息。

Answer 2

不是提交表单，而是构建URL然后设置位置。您可以在搜索字词中添加ID（在本例中为s），然后只需构建网址：

var searchTerm = document.getElementById("s").value;
document.location = "http://example.com/" + searchTerm;

在js中将搜索从/？s = searchterm更改为/ searchterm而不使用htaccess

2 个答案: