Question

我已经创建了bootstrap下拉列表，如下所示：

<ul style="right: 150px; position: absolute;">
    <li>  
        <ul class="nav">
            <li class="dropdown">
                <a class="dropdown-toggle" href="http://google.com">
                    Dropdown <b class="caret"></b>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 2</a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

所有链接（Link1和Link2）都显示在另一个之下。

但是，我应该只能通过点击DropDown来查看链接。

Answer 1

试试这个

$( document.body ).on( 'click', '.dropdown-menu li', function( event ) {

      var $target = $( event.currentTarget );

      $target.closest( '.btn-group' )
         .find( '[data-bind="label"]' ).text( $target.text() )
            .end()
         .children( '.dropdown-toggle' ).dropdown( 'toggle' );

      return false;

   });

如何在jquery中创建bootstrap下拉列表

1 个答案:

DEMO