0

如何读取和写入查询字符串？

var pageNumber = QueryString['pageNumber'];
var pageSize   = QueryString['pageSize'];

$('#next').click(function() { 
    QueryString['pageNumber'] = ++pageNumber;
    refresh(); 
});

function refresh() { /** get data and update page here **/ }

当然，这将允许用户复制和粘贴包含部分程序状态的 URL。

是否有类似于QueryString（上面使用的）的 API？

4

2 回答 2

2

正如 Richard 所提到的，通过分配给 window.location.search 来更改查询字符串将触发页面重新加载。

出于这个原因，通常的做法是在片段标识符中编码客户端状态（“哈希路由”，与旧浏览器兼容）或使用history.pushState（HTML5 的一部分）来操作路径。pushState 需要服务器端支持，通常采用通配符路由的形式。

Director或Backbone Router等库提供适用于任一技术的抽象。

更新 在对这个答案进行研究之前我不知道这一点，但可以通过 pushState 操作查询字符串（考虑到它是 URL 的一部分，这是有道理的）。正如该演示的作者所指出的，这允许在没有任何特殊服务器端支持的情况下使用 pushState。

于 2013-06-04T00:13:51.817 回答
0

浏览器内 JavaScript 可以使用浏览对象模型的window.location.search属性访问查询字符串。不过，解析该查询字符串的本机支持并不多。（另请参阅如何从 location.search 获取特定参数？）

也许这样的事情会做？

var GET = {}; // I've taken the liberty of re-naming your `QueryString` object
              // to just `GET`, kind of in the style of PHP.
              // Mostly because I find it confusing to refer to something which
              // is not a string (it is an object/map) as a string.
var queryString = window.location.search.replace(/^\?/, ''); // but this: *this* is a string!
queryString.split(/\&/).forEach(function(keyValuePair) {
    var paramName = keyValuePair.replace(/=.*$/, ""); // some decoding is probably necessary
    var paramValue = keyValuePair.replace(/^[^=]*\=/, ""); // some decoding is probably necessary
    GET[paramName] = paramValue;
});

var pageNumber = GET['pageNumber']?Number(GET['pageNumber']):0;

$('#next').click(function() { 
    GET['pageNumber'] = ++pageNumber;
    refresh(); 
});

function refresh() {
    var newQueryString = Object.keys(GET).reduce(function(keyValuePairs, paramName) {
        keyValuePairs.push(escape(paramName)+"="+escape(GET[paramName]));
        return keyValuePairs;
    }, []).join('&');

    window.location.search = "?"+newQueryString;
}
于 2013-06-01T04:43:22.907 回答