在变为活动的元素内扩展手风琴 - bootstrap

时间:2014-07-31 08:18:22

标签: javascript jquery html css twitter-bootstrap-3

我正在使用bootstrap框架创建一个票证选择面板。在面板中我们有“票证名称”,如果您单击面板中的任何位置,则输入/单选按钮将变为活动状态。

我的问题是我有一个字段作为“信息”按钮,这会使用bootstraps accordion组件扩展有关票证的信息。单击另一个故障单中的信息按钮时,故障单/输入/单选按钮变为活动状态。理想情况下,我想从另一张票中获取信息而不实际激活/选择票。所以我需要排除按钮使票证处于活动状态。

链接到我的演示 - https://7bfcde86fc7f3304fcc6b50556a41b7e2907d0fd.googledrive.com/host/0B8UWGEiox1HOV0pnVTdsQXJpemM/test.html(您可能需要加载不安全的脚本才能使演示完全正常工作 - Google驱动程序安全性)

<div class="row ticket-selector">
    <label class="no-style">
        <div class="col-xs-12">
            <div class="row pt-xs-15 pb-xs-15">
                <div class="col-xs-1 text-center font-xs-18 select-box">
                    <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" class="mt-xs-10"> <span class="glyphicons ok_2"></span>
                </div>
                <div class="col-xs-7 ticket-name">
                     <h4 class="font-xs-16 m-xs-0 mb-xs-5 mb-sm-0 mb-lg-5">Ticket Name <a data-toggle="collapse" data-parent="#ticket-panel" href="#collapseOne" class="tickets-more"><span class="halflings info-sign orange"></span></a></h4>

                    <p class="mb-xs-0 font-sm-13 font-lg-14">Lorem ipsum dolor sit amet, consec tetur adipiscing elit.</p>
                </div>
                <div class="col-xs-2 text-center text-center font-xs-16 price">
                    <p class="mt-xs-10">&pound;123</p>
                </div>
                <div class="col-xs-2 text-center font-xs-16 price">
                    <p class="mt-xs-10">&pound;123</p>
                </div>
                <div class="col-xs-12">
                    <div id="collapseOne" class="collapse pt-xs-10">
                        <p>Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et.</p>
                        <p>Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.</p>
                    </div>
                </div>
            </div>
        </div>
    </label>
</div>

0 个答案:

没有答案