Question

在某些情况下，我的一些Bootstrap下拉控件中只有一个选项，因此我想在这些实例中预先选择值。几乎没有突破。

下拉列表位于bootstrap中，并使用关联的ul作为值，如下所示 fiddle of the issue

下拉列表定义为......

<div class="btn-group postage">
    <button type="button" class="form-control btn btn-default dropdown-toggle postDropDown" data-toggle="dropdown">
         select...
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" role="menu" id="postList">
        <li id="foobar">
            <a href="javascript:void(0)" class="postitemselector">Why do I have to select when there is only one item in the list?</a>
        </li>
    </ul>                    
</div>

我尝试过各种各样的方法，但没有成功。

$(document).ready(function () {
   $('#postList option:first-child').attr("selected", "selected");
});

如何通过jQuery预先选择列表中的项目？（注意，我不想更改下拉列表的标记）

Answer 1

我触发手动点击事件的一种方式

$(".dropdown-menu li a").click(function () {
   //Add back the pesky caret which otherwise gets removed on selection.
   $(this).closest(".btn-group").find(".btn:first-child").html($(this).html() + '<span class="caret"></span>');
});

$(document).ready(function () {
    //need to do this after teh click handler is added
    $('#postList li:first a').click();
});

演示：Fiddle

使用jQuery

1 个答案: