更好地使用 Javascript 重定向或表单提交？答案

【问题标题】：Better to Javascript redirect OR form submit?更好地使用 Javascript 重定向或表单提交？
【发布时间】：2010-10-14 06:09:44
【问题描述】：

我正在做一个选择框导航器，想知道是否最好进行 javascript 重定向或提交表单并从那里重定向。各有优劣？

【问题讨论】：

标签： javascript html redirect submit

【解决方案1】：

HTTP 重定向：

优点：您可以记录用户的活动。
缺点：一个额外的周转周期，直到用户被有效重定向。

JavaScript 重定向：

优点：用户立即被重定向
缺点：您无法记录用户的活动，除非您使用 AJAX；如果用户禁用了 JavaScript，他将不会被重定向。

在这种情况下，我倾向于使用Unobtrusive JavaScript 来解决这个问题：就像没有启用 JavaScript 一样编写代码（即发布表单的“开始”按钮）；然后，在页面加载后，Javascript 会隐藏该按钮，向选择框添加更改功能并发送 AJAX 请求以记录活动。

这样你就可以两全其美了:)

【讨论】：

+1 现在没有回退到无 js 方法的名称（我想我应该有：P）...也就是说，将表单设置为使用 get 并直接转到页面更好:)

【解决方案2】：

如果您的意思是通过选择列表中的一项来进行导航，您可以同时执行以下操作：

使用 GET 配置表单，直接指向目标页面。
如果支持js，选择值时调用“提交”。如果不支持 js，则应显示一个选择/执行/打开按钮，让用户仍然可以使用应用程序

注意：上述方法直接进入目标页面。这与从服务器发送重定向不同，后者会导致处理额外的请求，增加操作的额外延迟和服务器处理的更多请求。这是一个导航场景，不需要为此进入服务器端（至少在没有其他特定要求的情况下）。

【讨论】：

【解决方案3】：

在做这样的事情时要小心：

<select id="test" onchange="doAction();">
  <option value='http://...'>...</option>
  <option value='http://...'>...</option>
  <option value='http://...'>...</option>
  <option value='http://...'>...</option>
</select>

<script type="text/javascript">
function doACtion() {
    window.location = document.getElementById('test');
}
</script>

这具有非常差的可访问性，因为 IE 用户尝试使用键盘导航选择会无意中触发该操作。这对于残障用户来说尤其麻烦，就好像您试图重定向他们一样，他们根本无法访问除第一个选项之外的任何内容。

【讨论】：