Question

我有一个页面，其中包含使用jQuery.load（）加载的数据，具体取决于用户选择的过滤器，可以是城市，也可以是类别或两者。

我在下拉框中有两个过滤器，并且能够使用onchange事件使其工作：

$('#filter1').change(function() { show_content(); });
$('#filter2').change(function() { show_content(); });

function show_content() {
    var city = encodeURIComponent($('#filter1').val());
    var category = encodeURIComponent($('#filter2').val());
    $('#div').load("feed.php?city="+city+"&category="+category);
}

以上现在有效。

问题是如何使其工作以便页面也可以处理查询字符串？

www.example.com/?city=City&category=Category

或者是否有其他方法可以在不创建重复页面的情况下实现此目的？

更新

使用其他堆栈用户的代码：

var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i)
    {
        var p=a[i].split('=');
        if (p.length != 2) continue;
        b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
    }
    return b;
})(window.location.search.substr(1).split('&'));

然后：

// If querystring is undefined use the value of select filter
// and if blank list all items
var city = (!qs['city']) ? $('#filter1').val() : qs['city'];

以上工作正常但当网址已经有查询时，选择其中一个下拉过滤器不再有效。

Answer 1

这是一种实现java脚本来获取查询字符串的方法

   function getQuerystring(key, default_)
    {
      if (default_==null) default_="";
      key = key.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
      var regex = new RegExp("[\\?&]"+key+"=([^&#]*)");
      var qs = regex.exec(window.location.href);
      if(qs == null)
        return default_;
      else
        return qs[1];
    }

所以在你的情况下，你可以使用像

这样的东西

www.example.com/?city=City&category=Category

var city = getQuerystring('city');
var category = getQuerystring('category');

将查询字符串传递给jQuery加载

1 个答案: