javascript - 如何使用 Bootstrap 保持圆 Angular

标签 javascript twitter-bootstrap

来自下图image with round corners , 我想隐藏第二个按钮,

使用 javascript,我需要第一个按钮有圆 Angular 。

在我使用 javascript 隐藏第二个按钮后,第一个按钮的右侧有一个矩形:

image after display none

如果我删除按钮节点,bootstrap 会设置圆 Angular ,但这没有用。

这就是我需要的,通过使用 javascript:

this is what i need

标准的 bootstrap html 按钮结构:

<div class="btn-group">
            <button class="btn btn-mini action_select customSelect" id="btn_bulk_action" data-toggle="button" disabled="disabled">Reply<span class="reply2"></span></button>
            <button class="btn btn-mini action_select" data-toggle="button" id="btn_bulk_action_archive" disabled="disabled" style="
    display: none;
">Archive<i class="icon-remove"></i></button>
                    </div>

最佳答案

这是因为您的按钮在一个按钮组中,默认情况下 bootstrap 需要多个按钮。

如果只有一个按钮,您应该删除按钮组或修改 css 以使按钮变圆。

无论如何回答你的问题,最简单的方法是通过 jquery:

$('.btn-group').removeClass('btn-group');

http://jsfiddle.net/uVffe/

虽然您可能想再次添加该类,但我会:

$('.btn-group').addClass('btn-group-single');

CSS:

.btn-group-single > .btn:first-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

然后您可以在将来删除它:

$('.btn-group').removeClass('btn-group-single');

http://jsfiddle.net/uVffe/1/

一个切换示例:

http://jsfiddle.net/uVffe/3/

关于javascript - 如何使用 Bootstrap 保持圆 Angular ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16667732/

相关文章:

javascript - 使用 primefaces 和 oncomplete 将表单目标更改为 _blank

twitter-bootstrap - Bootstrap input-group-sm 和 input-group-append 不起作用

html - 网格行的 Bootstrap 小设备顺序

html - 创建黑白网格 HTML/CSS

javascript - 如何通过 window.open 传递数据或对象

javascript - 如何以编程方式将焦点应用到 Firefox 中 iframe 中的父框架(解决 window.focus())?

html - 使用 Bootstrap 网格系统在右下角包含社交图标

javascript - 如何制作这种类型的 Bootstrap 轮播

javascript - 填充导航栏的方法 - Tables/CSS/JS

javascript - 查找 PHP、Node 和 Golang 中两个数组之间的区别