禁用Twitter引导按钮组 [英] Disable Twitter Bootstrap Button Group

问题描述

我在页面上有一个用于选择的按钮组。选择完成后，我希望按钮组仍然可见，以便用户可以看到他们所做的选择，但我不希望他们能够再使用它。有没有办法禁用按钮组？

I have a button group on a page that is used for a selection. After the selection is made I want the button group to still be visible so the user can see the selection they made, but I don't want them to be able to use it anymore. Is there a way to disable to the button group?

<div class="btn-group-vertical">
    <button type="button" class="btn btn-primary btn-lg">Option 1</button>
    <button type="button" class="btn btn-primary btn-lg">Option 2</button>
    <button type="button" class="btn btn-primary btn-lg">Option 3</button>
</div>

推荐答案

您可以使用按钮上的disabled属性来禁用他们的使用，如Bootstrap文档中所述。它基本上涉及将属性'disabled'添加到按钮元素，就像这样;

You can use the disabled attribute on the buttons to disable their use, as described in the Bootstrap docs. It essentially involves adding the attribute 'disabled' to the button element, like so;

<div class="btn-group-vertical">
    <button type="button" class="btn btn-primary btn-lg" disabled="disabled">Option 1</button>
    <button type="button" class="btn btn-primary btn-lg" disabled="disabled">Option 2</button>
    <button type="button" class="btn btn-primary btn-lg" disabled="disabled">Option 3</button>
</div>

您可以使用jQuery在您完成任何想要的操作后动态添加此属性

You can use jQuery to dynamically add this attribute once you've done whatever you want to do

$('.btn-group-vertical button').attr('disabled','disabled');

如果您想重新启用它，则可以使用

And if you wanted to re-enable it

$('.btn-group-vertical button').removeAttr('disabled');

请记住，上述内容会将此行为应用于具有此类名称的所有按钮组。如果你不想要，你需要添加一个ID到btn组div并在jQuery选择器中使用它。

Bear in mind that the above would apply this behaviour to all button groups with this class name. If you don't want that you'll need to add an ID to the btn group div and use that in the jQuery selector.

这篇关于禁用Twitter引导按钮组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！