加载后如何设置选择选项'selected'页面？

Question

我有代码html

<select class="mySelect">
    <option value="1" >Date</option>
    <option value="2">Helpfulness</option>
</select>

更新

因此，当用户选择"帮助"并重新加载页面时应"选择"选项"帮助"。如果选择了"日期"则重新加载的页面应将日期设置为"选定"。

谢谢你的帮助！

Answer 1

使用.val()到set，2的值如下：

$(function() {
    $('.mySelect').val( 2 );
});

$(function() {
    $('.mySelect').val( 2 );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select class="mySelect">
  <option value="1">Date</option>
  <option value="2">Helpfulness</option>
</select>

更新

根据您更新的问题，使用localStorage或cookies保存选定的值。当页面刷新时，检查cookie或localStorage值并加载它。

$(function() {
    $('.mySelect').on('change', function() {
        $.cookie('mySelect', this.value);
    });
    $('.mySelect').val( $.cookie('mySelect') || 1 );
});

DEMO

Answer 2

对于大多数默认值，可以很容易地直接在html标记上设置，如：

<select class="mySelect">
  <option value="1" >Date</option>
  <option value="2" selected>Helpfulness</option>
</select>

否则，在此处使用jQuery .prop代码：

$( function () {
   $('.mySelect option[value="2"]').prop('selected', true);
});

Answer 3

在val()和change()函数中设置值

jQuery(window).on('load', function () {
    $('.mySelect').val(2).change();
});