在前端开发中，下拉列表常常用于选择特定的选项。有时候我们需要通过代码来动态更改下拉列表的选项，这时候就可以使用jQuery来实现。
准备工作
首先，在HTML文件中添加一个下拉列表：
<select id="mySelect"> <option value="1">选项1</option> <option value="2">选项2</option> <option value="3">选项3</option> </select>
接下来，在JavaScript文件中引入jQuery库：
<script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script>
更改选定值
要更改下拉列表的选定值，可以使用jQuery的val()方法。该方法设置或返回匹配元素的值。
例如，如果我们要将选中的选项更改为“选项2”，可以使用以下代码：
$("#mySelect").val("2");此代码将通过选项的值设置选定的选项。
示例代码
以下是完整的示例代码，包括更改选定值和获取选定值：
-- -------------------- ---- ------- --------- ----- ------ ------ ------- ------------------------------------------------------------------ ------- ------ ------- -------------- ------- ---------------------- ------- ---------------------- ------- ---------------------- --------- ------- --------------------------------------- ------- ------------------------------------ -------- -------- -------------- - ------------------------ - -------- ----------- - --- ------------- - --------------------- --------------------- - --------- ------- -------
在这个示例中，我们添加了两个按钮，一个用于更改选定值，另一个用于获取选定值。当 changeOption() 函数被调用时，它将更改下拉列表的选定值为“选项2”。当 getOption() 函数被调用时，它将获取当前选定的选项的值并弹出警告框显示该值。
结论
使用jQuery可以方便地更改下拉列表的选定值。通过val()方法，可以设置或返回匹配元素的值。您可以使用模仿上述示例中的代码来实现更复杂的操作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/7977