根据查询字符串从 Javascript 设置下拉选项答案

【问题标题】：Setting dropdown option from Javascript based on querystring根据查询字符串从 Javascript 设置下拉选项
【发布时间】：2012-09-20 14:42:16
【问题描述】：

我有一个局部视图，其中有一个下拉菜单，我在我的页面中包含该局部视图两次。这是下拉菜单。

<form name="sortbyformtop">
            <select onchange="sort('@querystring', this.options[this.selectedIndex].value);" name="sortbyselecttop">
                <option value=""></option>
                <option value="accommodationtype">Accommodation type</option>
                <option value="mostreviewed">Most reviewed</option>
                <option value="lowestprice">Lowest price</option>
            </select>
        </form>

现在，当页面加载时，如果查询字符串包含一个键 sortby，那么我想取 sortby 的值（这将是 accommodationtype、mostreviewed、lowestprice，即选项）。我想做的是将页面上的两个下拉菜单都设置为与sortby 查询字符串值匹配的选项。我已经尝试了很多东西，但没有任何效果。

你能帮忙吗？

编辑

我试过了，但是没用

$(document).ready(function () {
                $("#sortbyselecttop option").filter(function () {
                    alert($(this).text());
                    return $(this).text() == "lowestprice";
                }).first().prop("selected", true);
            });

【问题讨论】：

你能发布一些你尝试过的例子吗？
谢谢。我可以看到的第一个问题是您的 jQuery 选择器 $('#sortbyselecttop option') 正在寻找“sortbyselecttop”的 id，而您已经给它一个 name 属性。

标签： javascript jquery query-string

【解决方案1】：

不确定我是否读得很好，但您是否只是希望下拉菜单选择查询字符串的值？

如果是这样，试试这个：

$('select[name="sortbyselecttop"]').val('accommodationtype');

如果选择有一个类名会更好，这样您就可以使用一个 jQuery 命令设置两个下拉菜单。

here's a fiddle

【讨论】：

我把它放在
确保它在 $(document).ready() 语句中。还。我之前有一个错误。我错过了]。你能再试一次吗
$(document).ready(function() { $('select[name="sortbyselecttop"]').val('accommodationtype'); })
我用了你的小提琴例子。我已经给下拉列表一个类，它只适用于第一个而不是第二个。我还没有把它放在 document.ready 函数中。
你也给第二个下拉菜单上课了吗？

【解决方案2】：

您不能访问名称为$("#name") 的控件，这是一个仅用于选择具有 ID 的 DOM 的选择器。但您仍然可以设置下拉列表的值，例如

$("select [name='sortbyselectop']").val(value);

假设 value 是您的查询字符串值所在的变量

function Querystring(qs)
{
this.params = {};
this.get = Querystring_get;
this.args = {};
qs = qs ? qs.replace(/^#/g, '') : location.search.substring(1, location.search.length);

if (qs.length == 0)
    return;
qs = qs.replace(/\+/g, ' ');
this.args = qs.split('&');
for (var i = 0; i < this.args.length; i++)
{
    var pair = this.args[i].split('=');
    var name = unescape(pair[0]);

    var value = (pair.length == 2)
     ? unescape(pair[1])
     : name;

    this.params[name] = value;
}
this.joined = function()
{
    var join = new Array();
    for (var a in this.params)
    {
        join.push(a + '=' + this.params[a]);
    };
    return join.join('&');
};

}
function Querystring_get(key, defaultValue)
{
var value = this.params[key];
return (value != null) ? value : defaultValue;
};

尝试这些功能并获得类似的价值

var qs = new Querystring().get("sortby", '');

现在 qs 将拥有您的查询字符串值，您可以设置下拉列表的值，如

$("select [name='sortbyselectop']").val(qs);

希望这会奏效。

【讨论】：