使用JavaScript检查URL是否包含某个值

Question

我正在为我的网站设计一个功能，使用户可以使用“后退”按钮而不必加载更多的数据库结果。

我先加载16个结果，然后有一个“加载更多”的按钮，它会加载下一个16个结果。在Ajax成功后，我会改变这个按钮的href，使URL从domain.com /＃1变成＃2。

昨晚我写了这个：

// First get the page URL and split it via # signs
var parts = location.href.split('#');

// now we run a check on the URL and see how many 'parts' there are
if(parts.length > 1)
{
  var params = parts[0].split('?');
  var mark = '?';
  if(params.length > 1)
  {
    mark = '&';
  }
  location.href = parts[0] + mark + 'page=' + parts[1];
}

这段代码获取URL，并将片段号转换为页码，然后重定向用户到同一页但页码已被转换的页面。接着我使用PHP $_GET函数并根据此设置limit子句的最后一个值。

这个方法能够正常运行，但它有些原始。例如，如果我返回上一页，URL就变成了：

www.domain.com/?page=1

如果我点击加载更多数据，页面的url会变成：

www.domain.com/?page=1#2

如果用户访问另一个页面然后返回，那么他们将被重定向到：

www.domain.com/?page=1&page=1

怎么解决这个问题呢？我想同时检查URL和查找片段，如果URL有一个页面变量i，那么将该变量添加到片段变量中，页面URL就变成了?page=THE SUM NUMBER

请帮忙修改上面发布的代码片段，以便检查URL是否具有页面值，然后在重定向之前将两者相加。

谢谢！

- Lovelock

Answer 1

你需要使用 location.search 来获取 URL 上的查询字符串：

var queryParameters = location.search.split('&');

接着，您可以循环遍历查询参数并检查是否设置了page：

var pageNumber = 0;
for(var i = 0; i < queryParameters.length; i++)
{
    var keyvaluePair = queryParameters[i].split('=');
    if(keyvaluePair[0] == 'page')
    {
        pageNumber = keyvaluePair[1];
        break;
    }
}

请参阅 MDN 上的文档：
https://developer.mozilla.org/zh-CN/docs/Web/API/Window/location
您可能还会发现这个例子有用，可以返回一个值：
https://developer.mozilla.org/zh-CN/docs/Web/API/Window/location#Example_.236.3A_Get_the_value_of_a_single_window.location.search_key.3A

如果您想获取 # 后面的信息，您需要使用 location.hash。我链接的 MDN 文档中也有关于 location.hash 的信息。

- Cameron Tinker