读取select上的data-option值

Question

使用JQuery，如何从List中单击/选择一个选项时，如何读取数据选项值。

<span data-name="" data-select="dropdown" class="btn-group dropdown dropdown-select">
    <a data-target="#" data-toggle="dropdown" class="btn dropdown-toggle">Select User</a>
    <a data-target="#" data-toggle="dropdown" class="btn dropdown-toggle end"><i class="icon-arrow-down"></i></a>
    <ul class="dropdown-menu">        
        <li class="active"><a data-option="1D" href="#">One Day</a></li>
        <li class=""><a data-option="1W" href="#">One Week</a></li>
        <li class=""><a data-option="2W" href="#">Two Weeks</a></li>

     </ul>
</span>

Answer 1

$("ul.dropdown-menu a").click(function(){
    alert($(this).data("option"));
});

Answer 2

试试

$("ul.dropdown-menu a").on("click",function(){
     alert($(this).data("option"));
});

当加载dom后添加元素时，click无效。

Answer 3

你可以做到

<li class="active"><a data-option="1D" href="#" onclick="getDataOption(this);">One Day</a></li>

var getDataOption = function (node) {
    var value = node.getAttribute("data-option");
    console.log(value);
    return value;
};

Answer 4

$("ul.dropdown-menu li").click(function(){

   alert($(this).attr("data-option"));
});