亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何在Bootstrap按鈕下拉標題中顯示所選項目

如何在Bootstrap按鈕下拉標題中顯示所選項目

鳳凰求蠱 2019-08-30 15:37:39
我在我的應用程序中使用bootstrap Dropdown組件,如下所示:<div class="btn-group">    <button class="btn">Please Select From List</button>    <button class="btn dropdown-toggle" data-toggle="dropdown">        <span class="caret"></span>    </button>    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">       <li><a tabindex="-1" href="#">Item I</a></li>       <li><a tabindex="-1" href="#">Item II</a></li>       <li><a tabindex="-1" href="#">Item III</a></li>       <li class="divider"></li>       <li><a tabindex="-1" href="#">Other</a></li>    </ul></div>我想將所選項目顯示為btn標簽。換句話說,將“請從列表中選擇”替換為已選擇的列表項(“項目I”,“項目II”,“項目III”)。
查看完整描述

3 回答

?
白衣非少年

TA貢獻1155條經驗 獲得超0個贊

我能夠稍微改善Jai的工作答案,如果你有一個以上的按鈕下拉,并且有一個非常好的演示文稿,它適用于bootstrap 3:


按鈕的代碼


<div class="btn-group">

  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">

    Option: <span class="selection">Option 1</span><span class="caret"></span>

  </button>

  <ul class="dropdown-menu" role="menu">

    <li><a href="#">Option 1</a></li>

    <li><a href="#">Option 2</a></li>

    <li><a href="#">Option 3</a></li>

  </ul>

</div>

JQuery代碼段


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


  $(this).parents(".btn-group").find('.selection').text($(this).text());

  $(this).parents(".btn-group").find('.selection').val($(this).text());


});

我還為“選擇”類增加了一個5px的邊距權限。


查看完整回答
反對 回復 2019-08-30
  • 3 回答
  • 0 關注
  • 552 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號