Question

我正在学习开发，我想要的是带有3个背景图像选项的引导下拉菜单，然后通过所选选项更改背景。目前我找不到如何获得所选选项的价值。我已经搜索了高低，找到了如何获取所选选项的值，然后使用它，但我找不到任何东西。甚至引导文档都很模糊。

到目前为止，下拉列表显示正常......

<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
})

我可以更改背景，但我无法获得所选选项的值。

我简直难以置信，所以我显然错过了一些东西。请任何人帮忙吗？

谢谢，

LB

Answer 1

这将返回单击项目的文本值。请注意，这不是select元素。

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

Answer 2

而不是＆＃34; hidden.bs.dropdown＆＃34;您可以在＆＃34;下拉项目＆＃34;：

上收听点击事件

＆＃13;

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

＆＃13;

<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>

＆＃13;

从选定的Bootstrap下拉选项中获取值

2 个答案: