Question

按钮组不能正常工作，问题是如果＆＃34; ON ＆＃34;如果选中，则不应再次选择，但问题甚至是＆＃34; ON＆＃34;按钮被选中我可以再次选择ON按钮。

当按钮已被选中时，如何停止按钮停止任何操作。

这是我的按钮组 ---

的代码

<form action="myclass.php" method="post">
    <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-default btn-xs myOnbutton">
            // myOnbutton is the button name
            <input type="radio" autocomplete="off"> ON
        </label>
        <label class="btn btn-default btn-xs myOffbutton">
            // myOffbutton is the button name
            <input type="radio" autocomplete="off"> OFF
        </label>
    </div>
</form>

有谁知道我在哪里犯了错误，所以再次选择按钮。

先谢谢。

Answer 1

如果要在首次选择后禁用组，则应使用Plunker之类的jquery：

var oShowContent = $(".js-show-content");
var oHiddenContainer = $(".js-hidden-container");
var oMainContainer = $(".js-main-container");

oShowContent.on({
    mouseenter: function () {
        oHiddenContainer.show();
    },
    mouseleave: function () {
        oHiddenContainer.hide();
    }
});

如果您只想禁用所选的单选按钮，Plunker：

 $(".btn-xs :radio").click(function(){
  $(".btn-xs :radio").attr("disabled", true); //Disable all with the same name
});

Answer 2

这是基本的HTML。它与bootstrap无关，你只需要在复选框中添加名称，这样你就无法选择它们。

<label class="btn btn-default btn-xs myOnbutton">
    <input type="radio" autocomplete="off" name="switch"> ON
  </label>
  <label class="btn btn-default btn-xs myOffbutton">
    <input type="radio" autocomplete="off" name="switch"> OFF
  </label>

用户不应该选择已经选择的按钮

2 个答案: