如何用jQuery改变下拉列表的选定值

要用 jQuery 改变下拉列表的选定值，可以通过设置下拉列表的选中选项来实现。

首先，需要获取下拉列表元素的 jQuery 对象，然后设置其选中选项的值，可以调用 .val() 方法来实现。具体步骤如下：

1. 获取下拉列表元素的 jQuery 对象

可以使用元素选择器 $('选择器') 来获取，选择器中填写下拉列表元素的 id、class 或标签名。

示例代码：

javascript
var $select = $('#my-select'); // 获取 id 为 'my-select' 的下拉列表元素

1. 设置下拉列表选中选项的值

可以使用 .val() 方法获取或设置下拉列表当前选中选项的值，方法的参数为待设置的选项的值。

示例代码：

javascript
$select.val('value1'); // 设置选中值为 'value1'

下面是两个完整示例：

示例1

HTML 代码：

<select id="my-select">
  <option value="value1">选项1</option>
  <option value="value2">选项2</option>
  <option value="value3">选项3</option>
</select>
<button id="btn-set">设置选中值</button>

JavaScript 代码：

$(document).ready(function() {
  // 等待文档加载完成后再执行
  var $select = $('#my-select');
  $('#btn-set').click(function() {
    $select.val('value2');  // 设置选中值为 'value2'
  });
});

点击按钮后，下拉列表的选中值会被设置为 'value2'。

示例2

HTML 代码：

<select class="my-select">
  <option value="value1">选项1</option>
  <option value="value2">选项2</option>
  <option value="value3">选项3</option>
</select>
<select class="my-select">
  <option value="value1">选项1</option>
  <option value="value2">选项2</option>
  <option value="value3">选项3</option>
</select>
<button id="btn-set-all">设置所有下拉列表的选中值</button>

JavaScript 代码：

$(document).ready(function() {
  // 等待文档加载完成后再执行
  $('.my-select').val('value2');  // 设置所有下拉列表的选中值为 'value2'
  $('#btn-set-all').click(function() {
    $('.my-select').val('value1');  // 设置所有下拉列表的选中值为 'value1'
  });
});

页面中有两个下拉列表，它们的 class 都为 'my-select'。页面加载完成后，所有下拉列表的选中值都被设置为 'value2'。点击按钮后，所有下拉列表的选中值会被设置为 'value1'。