javascript - HTML 选择选项值未更新

Question

我有一个 HTML 表单，其中包含以下选择元素:

<select class="form-control" onchange="$('form#filter').submit()" id="sort" name="sort">
    <option value="0" selected="selected">A - Z</option>
    <option value="1">Z - A</option>
</select>

问题是，当我选择不同的选项时，HTML 不会更新并将我选择的选项设置为所选选项。

我完全不知道为什么它没有更新，而且我已经研究了几个小时了。

这是绑定(bind)到表单上的提交事件的函数，以防您需要:

$("form#filter").on("submit", function(evt)
{
    var form = $(this);
    var target = $("div#bands");

    var url = form.attr("action") + "/" + form.find('option[selected]').val();
    console.log(url);

    $.get(url).done(function(data)
    {
        target.html(data);
    });

    evt.preventDefault();
});

Answer 1

改变

form.find("option[selected]").val()

至

form.find("option:selected").val()

或者:

form.find("select").val()

或者:

$("#sort").val()

选择器 option[selected] 找不到当前选定的选项，它会查找 DOM 中具有 selected 属性的选项(这通常是在 HTML 中带有 selected 属性，尽管可以使用 Javascript 更改它)。