使用jQuery按值选择下拉选项

Question

我选择了以下html结构

<select id="mainMenu" data-mini="true" name="select-choice-min">
   <option value="1">1</option>
   <option value="2">2</option>
   <option value="3">3</option>
   <option value="4">4</option>
   <option value="5">5</option>
   <option value="6">6</option>   
</select>

在页面加载我想最初设置选项值为5所以我尝试(但没有改变)

$(document).ready(function () {
   $('#mainMenu option').eq(5).prop('selected', true);
})

我正在使用jQuery 1.8.3和jQuery mobile,因为这是移动网站

<script src="/Scripts/jquery-1.8.3.js"></script>
<script src="/Scripts/jquery.mobile-1.4.2.js"></script>

更新:

我只是意识到发布的答案中的每个代码都有效(以及我的),#mainMenu选项值设置为所需的值(5),但它的文本不会改变(在任何这种情况下).这是正常的,并有解决方法.

我试过了 $("mainMenu").text("5");

Answer 1

刷新

这用于更新自定义选择以反映本机选择元素的值.如果选择中的选项数不同于自定义菜单中的项数,则它将重建自定义菜单.此外,如果传递一个真正的参数,则可以强制重建.

$("#mainMenu").val("5");
$("#mainMenu").selectmenu('refresh', true);

看看这里选择菜单

小提琴