Question

我有以下代码： -

<div class="DropDownContainer">
    <select class="DropDown">
        <option><span id="lblPeriod">Period</span></option>
        <option><span id="lblLike">Like</span></option>
        <option><span id="lblYear">Year</span> </option>
    </select>
</div>

现在我正在尝试获取所选值的id，并且我有以下jquery： -

        $('.DropDown').on('change', function () {

           var id = $(this).children(":selected").attr("span.id");
           alert(id);
        });

但是id未定义。 $（this）.val（）将返回文本，例如“Period”，“Like”或“Year”，但是我需要id，因为这是一个multilang项目，所以我必须依赖于id。 / p>

我的jquery有什么问题？

感谢您的帮助和时间

Answer 1

选项元素无法跨越它：

将您的HTML更改为：

<select class="DropDown">
    <option id="period">Period</option>
    <option id="like">Like</option>
    <option id="year">Year </option>
</select>


$('.DropDown').on('change', function () {
   var id = $(this).children(":selected").attr("id");
   alert(id);
});

如果Multilanguage是您在Asp.net中的问题，您也可以拥有选项元素的资源键，例如：

<asp:DropDownList id="MyDdl" runat="server">
   <asp:ListItem Value="period" Text="period" meta:resourcekey ="period_Item_MyDdl" />
   <asp:ListItem Value="like" Text="like" meta:resourcekey ="like_Item_MyDdl" />
   <asp:ListItem Value="year" Text="year" meta:resourcekey ="year_Item_MyDdl" />
</asp:DropDownList>

Answer 2

使用

<div class="DropDownContainer">
    <select class="DropDown">
        <option id="lblPeriod">Period</option>
        <option id="lblLike">Like</option>
        <option id="lblYear">Year</option>
    </select>
</div>

和

$('.DropDown').on('change', function () {
  var id = $(this).children(":selected").attr("id");
  alert(id);
});

您可以在选项元素上设置ID。此外，您必须在tne选项上设置value属性，才能将其作为可提交的表单。

请参阅小提琴：http://jsfiddle.net/YdXpv/1/

Answer 3

使用以下代码：

 $('.DropDown').on('change', function () {

      var id = $(this).children(":selected").text().find("span").prop("id");
      alert(id);
 });

Answer 4

使用find()和prop()

 var id = $(this).children(":selected").find('span').prop("id");

将id放在<select> </select> </span>中的<span>内

4 个答案: