Question

我有一个选择列表，用作移动访问者的主要导航。结构如下：

<select id="nav">
<option value="http://somesite.com/url_1">Page 1</option>
<option value="http://somesite.com/url_2">Page 2</option>
<option value="http://somesite.com/url_3">Page 3</option>
<option value="http://somesite.com/url_4">Page 4</option>
</select>

如何查看当前页面网址与选择列表中的网址，如果匹配，请将其设置为所选选项？我猜它会有点像这样：

var url = window.location;
$("#nav option").each(function() {
    var value = $(this).val();
    if(url === value) {
        $(this).val('selected','selected');
    };
});

Answer 1

selected是一个属性，您要设置新值，可以使用prop和filter方法。

var url = window.location.href;
$("#nav option").filter(function() {
    return this.value === url;
}).prop('selected', true);

您也可以使用属性选择器，但filter方法更有效。

Answer 2

你应该改变

$(this).val('selected','selected');

向

$(this).prop('selected',true);

最后（选项1）

$("#nav option").each(function() {
    if(window.location === $(this).val()) {
        $(this).val('selected','selected');
    };
});

或更容易（选项2）

$("#nav option[value='" + document.location + "']").prop("selected", true);

Answer 3

您可以使用jQuery属性选择器执行此操作：

$("#nav option[value='" + window.location + "']").prop('selected', true);

jQuery - 检查导航选择列表网址值对当前网址并设置为选中

3 个答案: