Question

我有一个名为Update的按钮，我想要禁用该按钮，直到从下拉菜单中选择一个选项。

到目前为止，我已禁用该按钮：

$('.btn-update').prop('disabled', true);

这是按钮和下拉菜单的标记：

<div class="col-md-12 tableContainer">
        <div class="panel-heading import-song-panel text-center">
            <div class="panel-title">
                <ul class="list-inline">
                    <li class="pull-right">
                        <div class="dropdownContainer btn-group text-right">
                            <button type="button" class="btn btn-primary br2 btn-md fs12 dropdown-toggle table-btn" id="table-actionbtn" data-toggle="dropdown" aria-expanded="false">
                                Select Status
                                <span class="caret ml5"></span>
                            </button>
                            <ul class="dropdown-menu dropdown-menu-right" role="menu">
                                <li>
                                    <a href="#" data-container="body" data-toggle="tooltip" title="Accept & Send" data-rowhover="editTableRow">Accept &amp; Send</a>
                                    <a href="#" data-container="body" data-toggle="tooltip" title="Accept" data-rowhover="editTableRow">Accept</a>
                                    <a href="#" data-container="body" data-toggle="tooltip" title="Reject" data-rowhover="editTableRow">Reject</a>
                                </li>
                            </ul>
                        </div>
                    </li>
                </ul>

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

    <div class="col-md-12 text-right">
        <div class="panel-heading import-song-panel text-right">
            <input type="button" class="btn btn-primary" id="js_CancelForm" value="Cancel" />
            <input type="submit" class="btn btn-success btn-update" id="js_SubmitForm" value="Update" />
        </div>
    </div>

如果从下拉菜单中选择状态，是否有人能够告诉我如何启用该按钮。

Answer 1

您可以在下拉列表选项中添加onclick事件。

<a href="#" data-container="body" onclick="enableButton()" data-toggle="tooltip" title="Accept & Send" data-rowhover="editTableRow">Accept &amp; Send</a>

并在点击事件上调用一个函数

function enableButton(){
 $('.btn-update').prop('disabled', false);
}

Answer 2

您可以在下拉选项中添加一个类，也可以添加一个click事件。像：

$('.optclick').click(function(){
$('.btn-update').prop('disabled', false);
e.preventDefault();

});

https://jsfiddle.net/Lz8sxmqm/10/

根据下拉选择启用和禁用按钮。 - Bootstrap 3

2 个答案: