從選定的引導下拉選項獲取價值

我正在學習開發，我想要的是帶有3個背景圖像選項的引導下拉框，然後通過選定的選項更改背景。目前我無法找到如何獲得所選選項的價值。我搜索了高和低來找到如何獲得選定的選項的價值，然後使用它，但我找不到任何東西。即使bootstrap文檔也很模糊。從選定的引導下拉選項獲取價值

到目前爲止下拉呈現好的...

<div class="dropdown open"> 
      <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
      Background 
      </button> 
      <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> 
      <a class="dropdown-item" href="#">Image 1</a> 
      <a class="dropdown-item" href="#">Image 2</a> 
      <a class="dropdown-item" href="#">Image 3</a> 
      </div> 
     </div>

但後來我被卡住......

$('#dropdownMenuButton').on('hidden.bs.dropdown', function() { 
    // get selected option and change background 
})

我可以改變背景，但我只是無法得到的值選定的選項。

我不敢相信這是如此困難，所以我明顯失去了一些東西。請任何人都可以幫忙？

感謝，

來源

2016-11-29 Leonard Bassoon

你試圖讓文本值或href值？ – bob

這將返回該項目的文本值點擊。請注意，這不是select元素。

$('.dropdown-item').click(function() { 
    console.log($(this).text()); 
});

來源

2016-11-29 20:19:45 bob

謝謝。像魅力一樣工作。不能認爲我出錯的地方很簡單。 –

取而代之的是「hidden.bs.dropdown」事件中，你可以監聽click事件上「下拉菜單項目」的：

$('#dropdownMenuButton + [aria-labelledby="dropdownMenuButton"] a').on('click', function (e) { 
 
    e.preventDefault(); 
 
    // get selected option and change background 
 
    var ele = this; 
 
    console.log(ele.textContent); 
 
})

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 

 
<div class="dropdown open"> 
 
    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
 
     Background 
 
    </button> 
 
    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> 
 
     <a class="dropdown-item" href="#">Image 1</a> 
 
     <a class="dropdown-item" href="#">Image 2</a> 
 
     <a class="dropdown-item" href="#">Image 3</a> 
 
    </div> 
 
</div>

來源

2016-11-29 20:23:55 gaetanoM

從選定的引導下拉選項獲取價值

回答

相關問題