引导程序按钮下拉菜单将所选值设置为li

时间:2020-02-17 01:15:26

标签: javascript jquery html css twitter-bootstrap

我的表单中有一个选择框,在页面加载后,它会在选择框之前转换为引导按钮。我无法为转换后的引导程序按钮下拉列表li设置选定的值。

<button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="Occupation" title="-- Please select Occupation--">
<span class="filter-option pull-left">-- Please select Occupation--</span>&nbsp;<span class="bs-caret">
<span class="caret"></span></span></button>
<div class="dropdown-menu open"><ul class="dropdown-menu inner" role="menu">
<li data-original-index="0" class="selected"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">-- Please select Occupation--</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li>
<li data-original-index="1"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Salaried</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li>
<li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Business</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li>
<li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Above 18 Years</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div>
<select name="Occupation" class="form-control show-tick" required="" tabindex="-98">
          <option value="">-- Please select Occupation--</option>
          <option value="Salaried">Salaried</option>
          <option value="Business">Business</option>
          <option value="Above 18">Above 18 Years</option>
</select>

我在localStorage.getItem('Occupation')中拥有值,并且我尝试使用

将值设置为该li
$('#Occupation ul li').eq(1).find('span').eq(1).text(localStorage.getItem('Occupation'));    //not worked
$('#Occupation').parents('.btn-group').find('.dropdown-toggle').html(localStorage.getItem('Occupation')+' <span class="caret"></span>');  //not worked
$("#Occupation li a").filter("[value=" + localStorage.getItem('Occupation') + "]"); //not worked
$("#Occupation").html(localStorage.getItem('Occupation') + '&nbsp;<span class="caret"></span>');  //not worked

有人可以向我建议一种将值设置为该下拉菜单的解决方案吗?

谢谢:)

1 个答案:

答案 0 :(得分:0)

经检查,我的网站上安装了一个插件(bootstrap-select)。该插件将我的选择框修改为引导按钮。

然后我访问了插件站点并获得了解决方案,

$('select[name="Occupation"]').selectpicker('val', localStorage.getItem('Occupation'));

相关问题