如何从DropDown中的选定选项获取title属性的值

Question

我有一个html select元素，其中包括三个option元素。 我已经编写了一个jQuery代码，该代码为我提供了当前所选选项元素的标题属性值，并将该值保存在一个变量中（即时！）。

但是我想从一个选项值中读取一个title属性，该属性不是动态选择的，并且如果该页面是第一次加载的，则已经在我的xhtml页面中显示为选择的值。

这是我的jQuery代码，第二个代码行无法正常工作：

$(document).ready(function(){

   var optionElements = jQuery(jQuerySelektorHTMLSelectElement).children();
   var OptionField = optionElements.find("[value=" + selectedValue + "]");
   var OptionFieldTitleAttribut = OptionFeld.attr("title"); 

}

如果加载了xhtml页面，如何找到未即时选择但被选择的option元素？

Answer 1

如果您的变量jQuerySelektorHTMLSelectElement是良好的命名，你不必叫children ：

var selectElement = $(jQuerySelektorHTMLSelectElement); // <- remove children here
var OptionField = selectElement.find("[value=" + selectedValue + "]");
var OptionFieldTitleAttribut = OptionField.attr("title"); 

find方法已经在子级中寻找选择器...

看到这个小提琴 。

Answer 2

尝试这个：

HTML

<select id="test">
    <option customAttr="a">test1</option>
    <option customAttr="b">test2</option>
    <option customAttr="c" selected="selected">test3</option>
    <option customAttr="d">test4</option>
</select>

JS

$(function(){
  console.log($("#test").find("option:selected").attr("customAttr"));
});

小提琴