单选按钮引导面板不工作

Radio Button Bootstrap Panel not working

本文关键字：工作 单选按钮      更新时间：2023-09-26

http://jsfiddle.net/um7m89hp/10/

    <div class="piGal pull-right">
    Some image or <br />
    images will go <br />
    over here.
</div>
<div class="panel-group pull-left" id="products">
    <div class="panel panel-default">
        <div class="panel-heading" data-toggle="collapse" data-parent="#products" href="#partnumber1">
            <h4 class="panel-title">
                <div>
                    <input type="radio" name="specs">
                            Some Product Title #1<br /> 
                            Some Product Subtitle
                </div>
            </h4>
        </div>
        <div id="partnumber1" class="panel-collapse collapse">
             <div class="list-group">
                 <ul class="list-group">
                     <li class="list-group-item">Some product data</li>
                     <li class="list-group-item">Some product data</li>
                </ul>
             </div>
        </div>
        <div class="panel-heading" data-toggle="collapse" data-parent="#products" href="#partnumber2">
            <h4 class="panel-title">
                <div>
                    <input type="radio" name="specs">
                        Some Product Title #2 <br />
                        Some Product Subtitle
                </div>
            </h4>
        </div>
        <div id="partnumber2" class="panel-collapse collapse">
             <div class="list-group">
                 <ul class="list-group">
                     <li class="list-group-item">Some product data</li>
                     <li class="list-group-item">Some product data</li>
                </ul>
             </div>
        </div>
    </div>
</div>

单选按钮仅在单击面板中的文本时进行检查。如果直接单击单选按钮本身或在边界空间中，它将激活面板，但不会选中单选按钮。在这个问题上有什么帮助吗？我试图将单选按钮放在面板文本的一侧，以保持格式。

是的，奇怪的行为。我猜手风琴上有BS css。你所需要做的就是改变检查收音机的触发器。我有关于坍塌的shown事件的信息。 
 $(".panel-collapse").on("shown.bs.collapse", function(event) {
     //travel up the DOM to the heading and check the radio
     $(this).prev('.panel-heading').find('input').prop("checked", true);
});

小提琴在这儿：http://jsfiddle.net/um7m89hp/16/

相关文章：