按鈕中的下拉菜單值

Question

這是一個下拉菜單，我要在從列表中選擇的值的基礎上顯示按鈕中的值。.隨附屏幕截圖以供參考。 最好的方法是什么？

<button 
    type="button" 
    class="btn btn-fit-height grey-salt dropdown-toggle" 
    data-toggle="dropdown" 
    data-hover="dropdown" 
    data-delay="1000" 
    data-close-others="true">

        //Where Value 1 is written I want the li values..
        Value 1
        <i class="fa fa-angle-down"></i>
</button>

<ul class="dropdown-menu pull-right" style="margin-right:15px" role="menu">
    <li><a href="#">Value 1</a></li>
    <li><a href="#">Value 2</a></li>
    <li class="divider"></li>
    <li><a href="#">Value 3</a></li>
    <li><a href="#">Value 4</a></li>
    <li><a href="#">Value 5</a></li>
    <li><a href="#">Value 6</a></li>
</ul>

Answer 1

你可以做

$(function() {
    var $button = $('button'); // maybe better give it an id or something

    $('.dropdown-menu.pull-right a').on('click', function(e) {
        e.preventDefault();

        $button.text($(this).text());
    });
});

但是您必須制作有效的HTML（必須關閉按鈕）