jQuery: 获取下拉菜单中自定义属性的值

Question

我有一段简单的 JQuery 代码。

$(document).ready(function() { 
  $( ".translanguage" ).change(function() {
      var value = $(this).attr("langid");
      alert(value);
  });
});

and i have html code.

<select name="translanguage" class="translanguage">
  <option value="0">Please Select Language</option>
  <option class="transoption" value="1" langid="1">Urdu</option>
  <option class="transoption" value="2" langid="2">English</option>
  <option class="transoption" value="3" langid="3">Arabic</option>
  <option class="transoption" value="4" langid="4">Sindhi</option>
</select>

当我运行这个程序时，在警报框中出现了未定义的错误。我需要选项标签中给定的langid值。

那么我的代码有什么问题？

其次，JQuery未定义错误的原因是什么。

谢谢。

- Muhammad Rizwan Kaim Khani

---

你应该在自定义属性前面添加 data-：data-langid="1"。这样就是有效的HTML5。 - nbar

Answer 1

在更改处理程序内，this指的是元素，但langid位于所选option元素中。因此，您需要查找所选的option，然后在该元素上调用.attr("langid")jQuery(function () { $(".translanguage").change(function () { var value = $(this).find('option:selected').attr("langid"); alert(value); }); }) 演示：Fiddle

- Arun P Johny

Answer 2

这个脚本适用于您。请查看jsfiddle。

$(function () {
    $(".translanguage").change(function () {
        var value = $( "select option:selected" ).attr("langid");
        alert(value);
    });
})

- sachin chavda

Answer 3

试试像这样

      $( ".translanguage" ).change(function() {
          alert(this.options[this.selectedIndex].getAttribute('langid'));
      });

- rajesh kakawat

Answer 4

试试这个：

// jquery wont find the attr of langid, change the langid to id in html.
$(document).ready(function() { 
  $( ".translanguage" ).change(function() {
    var value = $(this).attr("id");
    alert(value);
  });
});

- sreenath