jQuery的文档指出：

[jQuery.val] 选中或选择与值集匹配的所有单选按钮、复选框和选择选项。

此行为在版本及更高版本中。jQuery1.2

你很可能想要这个：

$("._statusDDL").val('2');

添加以查看下拉列表前端中的选项：.change()

$("._statusDDL").val('2').change();

试试吧

$("._statusDDL").val("2");

而不是

$("._statusDDL").val(2);

如何将值加载到下拉列表中或确定要选择的值？如果使用 Ajax 执行此操作，则在选择发生之前需要延迟的原因可能是因为在执行相关行时未加载值。这也可以解释为什么在设置状态之前将警报语句放在行上时它起作用，因为警报操作会为数据加载提供足够的延迟。

如果您使用的是 jQuery 的 Ajax 方法之一，则可以指定一个回调函数，然后放入回调函数中。$("._statusDDL").val(2);

这将是处理问题的更可靠的方法，因为您可以确保该方法在数据准备就绪时执行，即使花费的时间超过 300 毫秒。

仅供参考，您无需使用 CSS 类即可完成此操作。

您可以编写以下代码行，以在客户端上获取正确的控件名称：

$("#<%= statusDDL.ClientID %>").val("2");

ASP.NET 将在 jQuery 中正确呈现控件 ID。

请注意 - 我一直在 jQuery 中使用通配符选择器来获取被 ASP.NET 客户端 ID 混淆的项目 - 这可能对您有所帮助：

<asp:DropDownList id="MyDropDown" runat="server" />

$("[id* = 'MyDropDown']").append("<option value='-1'>&nbsp;</option>"); //etc

请注意 id* 通配符 - 即使名称为“ctl00$ctl00$ContentPlaceHolder1$ContentPlaceHolder1$MyDropDown”，这也将找到您的元素

所以我改变了它，现在它 在 300 毫秒后使用 setTimeout。现在似乎正在工作。

在从 Ajax 调用加载数据时，我遇到过很多次这种情况。我也使用 .NET，使用 jQuery 选择器时需要时间来调整到 clientId。为了纠正你遇到的问题并避免必须添加属性，你可以简单地在 Ajax 调用中输入“”，这将给 DOM 足够的时间来恢复你要添加到选择中的对象。下面是一个小示例：setTimeoutasync: false

$.ajax({
    type: "POST",
    url: document.URL + '/PageList',
    data: "{}",
    async: false,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (response) {
        var pages = (typeof response.d) == 'string' ? eval('(' + response.d + ')') : response.d;

        $('#locPage' + locId).find('option').remove();

        $.each(pages, function () {
            $('#locPage' + locId).append(
                $('<option></option>').val(this.PageId).html(this.Name)
            );
        });
    }
});

<asp:DropDownList id="MyDropDown" runat="server" />

用。$("select[name$='MyDropDown']").val()

我使用扩展函数来获取客户端 ID，如下所示：

$.extend({
    clientID: function(id) {
        return $("[id$='" + id + "']");
    }
});

然后，您可以在jQuery中调用 ASP.NET 控件，如下所示：

$.clientID("_statusDDL")

另一种选择是在 .net 中设置控制参数 ClientID=“Static”，然后您可以通过您设置的 ID 访问 JQuery 中的对象。

在查看了一些解决方案后，这对我有用。

我有一个包含一些值的下拉列表，我想从另一个下拉列表中选择相同的值...因此，首先我在第一个下拉列表中放入一个变量。selectIndex

var indiceDatos = $('#myidddl')[0].selectedIndex;

然后，我在第二个下拉列表中选择该索引。

$('#myidddl2')[0].selectedIndex = indiceDatos;

注意：

我想这是最短、最可靠、最通用和最优雅的解决方案。

因为就我而言，我使用的是所选选项的数据属性而不是值属性。 因此，如果您每个选项都没有唯一的值，上面的方法是最短和甜蜜的！

对于隐藏字段，您需要像这样使用：

$("._statusDDL").val(2);
$("._statusDDL").change();

或

$("._statusDDL").val(2).change();

这些解决方案似乎假定下拉列表中的每个项目都有一个与其在下拉列表中的位置相关的 val（） 值。

如果不是这样，事情就有点复杂了。

要读取下拉列表的选定索引，您可以使用以下命令：

$("#dropDownList").prop("selectedIndex");

要设置下拉列表的选定索引，可以使用以下命令：

$("#dropDownList").prop("selectedIndex", 1);

请注意，prop（） 功能需要 JQuery v1.6 或更高版本。

让我们看看如何使用这两个函数。

假设您有一个月份名称的下拉列表。

<select id="listOfMonths">
  <option id="JAN">January</option>
  <option id="FEB">February</option>
  <option id="MAR">March</option>
</select>

您可以添加一个“上个月”和“下个月”按钮，该按钮会查看当前选定的下拉列表项，并将其更改为上个月/下个月：

<button id="btnPrevMonth" title="Prev" onclick="btnPrevMonth_Click();return false;" />
<button id="btnNextMonth" title="Next" onclick="btnNextMonth_Click();return false;" />

下面是这些按钮将运行的 JavaScript：

function btnPrevMonth_Click() {
    var selectedIndex = $("#listOfMonths").prop("selectedIndex");
    if (selectedIndex > 0) {
        $("#listOfMonths").prop("selectedIndex", selectedIndex - 1);
    }
}
function btnNextMonth_Click() {
    //  Note:  the JQuery "prop" function requires JQuery v1.6 or later
    var selectedIndex = $("#listOfMonths").prop("selectedIndex");
    var itemsInDropDownList = $("#listOfMonths option").length;

    //  If we're not already selecting the last item in the drop down list, then increment the SelectedIndex
    if (selectedIndex < (itemsInDropDownList - 1)) {
        $("#listOfMonths").prop("selectedIndex", selectedIndex + 1);
    }
}

我的网站对于显示如何使用 JSON 数据填充下拉列表也很有用：

http://mikesknowledgebase.com/pages/Services/WebServices-Page8.htm

<asp:DropDownList ID="DropUserType" ClientIDMode="Static" runat="server">
     <asp:ListItem Value="1" Text="aaa"></asp:ListItem>
     <asp:ListItem Value="2" Text="bbb"></asp:ListItem>
</asp:DropDownList>

ClientIDMode=“静态”

$('#DropUserType').val('1');

我知道这是一个老问题，除了在某些情况下，上述解决方案都可以正常工作。

喜欢

<select id="select_selector">
<option value="1">Item1</option>
<option value="2">Item2</option>
<option value="3">Item3</option>
<option value="4" selected="selected">Item4</option>
<option value="5">Item5</option>
</select>

因此，项目 4 将在浏览器中显示为“已选择”，现在您希望将值更改为 3 并将“项目 3”显示为已选择，而不是根据上述解决方案 Item4.So，如果您使用

jQuery("#select_selector").val(3);

您将看到在浏览器中选择的项目 3。但是当您在 php 或 asp 中处理数据时，您会发现所选值为“4”。原因是，你的html将看起来像这样。

<select id="select_selector">
<option value="1">Item1</option>
<option value="2">Item2</option>
<option value="3" selected="selected">Item3</option>
<option value="4" selected="selected">Item4</option>
<option value="5">Item5</option>
</select>

它得到最后一个值，即“4”，以服务器侧语言表示。

所以我在这方面的最终解决方案

newselectedIndex = 3;
jQuery("#select_selector option:selected").removeAttr("selected");
jQuery("#select_selector option[value='"+newselectedIndex +"']").attr('selected', 'selected');  

编辑：在“+newselectedIndex+”周围添加单引号，以便相同的功能可用于非数值。

所以我所做的实际上是删除选定的属性，然后将新属性设置为选定的属性。

我将不胜感激 @strager 、 @y0mbo 、 @ISIK 等高级程序员对此发表评论

如果我们有一个标题为“数据分类”的下拉列表：

<select title="Data Classification">
    <option value="Top Secret">Top Secret</option>
    <option value="Secret">Secret</option>
    <option value="Confidential">Confidential</option>
</select>

我们可以把它变成一个变量：

var dataClsField = $('select[title="Data Classification"]');

然后将我们希望下拉列表具有的值放入另一个变量中：

var myValue = "Top Secret";  // this would have been "2" in your example

然后我们可以使用我们放入的字段，使用 find for 并使其被选中：dataClsFieldmyValue.prop()

dataClsField.find('option[value="'+ myValue +'"]').prop('selected', 'selected');

或者，你可以只使用 ，但你的选择器 只有在它与下拉列表中的类匹配时才能使用，并且你应该在括号内的值上使用引号，或者只使用我们之前设置的变量：.val().

dataClsField.val(myValue);

就我而言，我能够使用 .attr（） 方法让它工作。

$("._statusDDL").attr("selected", "");

纯JS

对于现代浏览器来说，使用CSS选择器对于纯JS来说不是问题

document.querySelector('._statusDDL').value = 2;

function change() {
  document.querySelector('._statusDDL').value = 2;
}

<select class="_statusDDL">
  <option value="1" selected>A</option>
  <option value="2">B</option>
  <option value="3">C</option>
</select>

<button onclick="change()">Change</button>

如果我们想从选项名称中查找，然后使用jQuery选择选项，请参阅下面的代码：-

<div class="control">
           <select name="country_id" id="country" class="required-entry" title="Country" data-validate="{'validate-select':true}" aria-required="true">
              <option value=""> </option>
              <option value="SA">Saudi Arabia</option>
              <option value="AF">Afghanistan</option>
              <option value="AR">Argentina</option>
              <option value="AM">Armenia</option>
              <option value="AW">Aruba</option>
              <option value="AU">Australia</option>
              <option value="AT">Austria</option>
              <option value="IS">Iceland</option>
              <option value="IN">India</option>
              <option value="ID">Indonesia</option>
              <option value="IR">Iran</option>
              <option value="IQ">Iraq</option>
              <option value="IE">Ireland</option>
              <option value="IM">Isle of Man</option>
              <option value="IL">Israel</option>
              <option value="IT">Italy</option>
              <option value="JM">Jamaica</option>
              <option value="JP">Japan</option>
              <option value="JE">Jersey</option>
              <option value="JO">Jordan</option>
              <option value="AE">United Arab Emirates</option>
              <option value="GB">United Kingdom</option>
              <option value="US" selected="selected">United States</option>
           </select>
        </div>
<script type='text/javascript'>
let countryRegion="India";
     jQuery("#country option:selected").removeAttr("selected");
        let cValue= jQuery("#country option:contains("+countryRegion+")").val();
        jQuery("#country option[value='"+cValue +"']").attr('selected', 'selected');
</script>

我希望这会有所帮助！

根据阿凡达的评论，最简单的解决方案是

$( the_selector ).val( the_new_value ).change();