0

这是我拥有的下拉代码,它根据所做的选择创建一个查询字符串。我要弄清楚的唯一一项是如何在页面重新加载时保留选择。

<html>
<select id="categoryFilter">
<option value=""></option>
<option name="Category1" id=Category1 value=".">All</option>
<option name="Category2" id=Category2 value="2.1">Processors</option>
<option name="Category3" id=Category3 value="2.4">GPU</option>
<option name="Category4" id=Category4 value="1">Corporate</option>
</select>

<script>
function setSelectedIndex(s, valsearch)
{
// Loop through all the items in drop down list
for (i = 0; i< s.options.length; i++)
{    
    if (s.options[i].value == valsearch)
    {
        // Item is found. Set its property and exit
        s.options[i].selected = true;
        break;
    }
 }
return;
}

function Filter_Init()
{
    var fvalue= JSRequest.QueryString['categoryFilter'];
    setSelectedIndex(document.getElementById('categoryFilter'), decodeURI(fvalue));
}

$('#categoryFilter').change(function() {
window.location = 'http://' + location.hostname + location.pathname + '?' +       $("#categoryFilter option:selected").attr('id') + '=' + $("#categoryFilter option:selected").val() + '#2';
Filter_Init();
});

4

2 回答 2

0

您必须在页面加载时解析查询参数的 url 字符串,然后有一些逻辑来定位相应的元素并使其“被选中”。您最好使用服务器端语言执行此操作,这样就没有“flash”(在一种状态下加载元素而不是在 DOM 加载后更改为另一种状态)。

为 Javascript 实现尝试这样的事情: 如何在 JavaScript 中获取查询字符串值?

于 2013-06-10T22:14:39.553 回答
0

这就是我解决问题的方法。

  1. 在页面加载时提取查询字符串。

    如何在 JavaScript 中获取查询字符串值?

  2. 根据传入的查询字符串选择正确的选项。

我在您的查询中注意到的一件事是您正在发送类似 ?Category2=2.1 的查询,我认为它有点不灵活。从长远来看,像 ?id=Category2&value=2.1 这样的东西可能会更灵活。

这个 JS 库非常适合作为 URL 解析器库。

http://blog.stevenlevithan.com/archives/parseuri

于 2013-06-10T22:14:42.847 回答