如何使用jquery在var中获取下拉列表的所有值

本文关键字：下拉列表 获取 何使用 jquery var | 更新日期: 2023-09-27 18:04:45

我想比较字符串与下拉列表中的所有值。以及dropdownlist的哪个值与该字符串匹配并且应该被选中。

例子
<div class="col-lg-3">
     <asp:DropDownList ID="DropDownListVendor" class="form-control text-box-border" runat="server" DataSourceID="SqlDataSource1" DataTextField="vendor_name" DataValueField="vendor_name"></asp:DropDownList>
     <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:Nibrass_DBConnectionString %>" SelectCommand="SELECT [vendor_name] FROM [Vendor_tb]"></asp:SqlDataSource>
</div>

DropDownListVendor已经在下拉列表中返回并显示两个值[Compaq,Hp]。

现在我想比较一个字符串与所有的dropdownlistvendor值。我尝试了这个代码来获取下拉列表的所有值。但是它不工作。

var vendorArr = [];
$('#DropDownListVendor').each(function() {
  vendorArr.push($(this).attr('value'));
});
alert("vendor Array ==" + vendorArr[0]);

在警报vendor Array == Undefined中返回。谢谢。

如何使用jquery在var中获取下拉列表的所有值

在您的情况下，您必须循环options。#DropDownListVendor选择器只能获得select元素本身，以及当前的selected value，而不是所有可能的值。

$('#DropDownListVendor option').each(function() {
    vendorArr.push($(this).attr('value'));
});

工作的例子:

var vendorArr = [];
$('#DropDownListVendor option').each(function() {
    vendorArr.push($(this).attr('value'));
});
console.log(vendorArr);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="DropDownListVendor">
  <option value="Compaq">Compaq</option>
  <option value="HP">HP</option>
  <option value="Lenovo">Lenovo</option>
  <option value="IBM">IBM</option>
</select>

您可以使用.map()在select列表中循环使用选项，如

var vendorArr = $("#DropDownListVendor option").map(function() {
  return this.value;
}).get();

既然，asp下拉列表id可能会改变，当呈现在html中，如果你使用asp母版页面，你可以使用Attribute Ends With Selector来解决，如:

var vendorArr = $("[id$='DropDownListVendor'] option").map(function() {
  return this.value;
}).get();
相关文章：