从引导下拉列表中检索值不起作用答案

【问题标题】：Retrieving value from a bootstrap dropdownlist not working从引导下拉列表中检索值不起作用
【发布时间】：2014-09-28 21:47:09
【问题描述】：

我有一个 bootsrap 主题的下拉列表，但我似乎无法使用 jQuery 从中检索值。

<label class="col-lg-2 control-label">Type</label>
                    <div class="col-lg-10">
                        <div class="btn-group m-r">
                      <button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
                        <span class="dropdown-label">Offices</span> 
                        <span class="caret"></span>
                      </button>
                      <ul  id="selType" class="dropdown-menu dropdown-select">
                          <li class="active"><a href="#"><input type="radio" name="d-s-r" value="Offices">Offices</a></li>
                          <li class=""><a href="#"><input type="radio" name="d-s-r" value="Warehousing">Warehousing</a></li>
                          <li class=""><a href="#"><input type="radio" name="d-s-r" value="Retail">Retail</a></li>

                      </ul>
                    </div>
                    </div>

活动类表示选择的值。但是当我做这样的事情时似乎不起作用。

var Type = $('ul#selType li.selected').text();
var Type = $('ul li.active a input').text();
var Type = $('#selType li.active').find('input').text();
var Type = $('ul li.selected a input:radio').val();
var Type = $('ul li.active a input').text();

我是新手，所以我可能会遗漏一些东西，所以任何想法都将不胜感激。

提前致谢。

【问题讨论】：

标签： jquery css asp.net twitter-bootstrap

【解决方案1】：

首先

var Type = $('ul#selType li.selected').text();

是不好的用法。当有一个 id 时，总是只选择 id。使用 #selType 而非 ul#selType 选择 with

对于您的问题，您可以使用以下方法获得单选按钮选择值：

$('input[name=d-s-r]:checked').val();

【讨论】：

我会记住这一点。感谢您的快速回复。我决定选择另一条路线，但感谢您的帮助。

【解决方案2】：

你应该这样做（点击按钮提示）：

$(".dropdown-toggle").click(function getvalue(){
var type = $('#selType input:checked').val();
if (typeof type ==='undefined'){
alert("Please select an option!");
}
else{
    alert (type);
}
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<label class="col-lg-2 control-label">Type</label>
                    <div class="col-lg-10">
                        <div class="btn-group m-r">
                      <button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
                        <span class="dropdown-label">Offices</span> 
                        <span class="caret"></span>
                      </button>
                      <ul  id="selType" class="dropdown-menu dropdown-select">
                          <li class="active"><a href="#"><input type="radio" name="d-s-r" value="Offices">Offices</a></li>
                          <li class=""><a href="#"><input type="radio" name="d-s-r" value="Warehousing">Warehousing</a></li>
                          <li class=""><a href="#"><input type="radio" name="d-s-r" value="Retail">Retail</a></li>

                      </ul>
                    </div>
                    </div>

【讨论】：

我试过你的代码，但问题是用户不会总是点击，我不想太添加请选择作为下拉项目。但我让它工作了，我决定只从 span 标签中检索值。它在页面加载时设置，因此无需单击，并且在您选择新项目时更新，因此它始终具有正确的值。不过还是谢谢。

【解决方案3】：

使用上述答案需要点击。所以我决定给我的按钮一个 id，然后获取该按钮的内部 span 标签的值，它始终是正确的值。

【讨论】：