用一个按钮展开其他按钮答案

【问题标题】：With a only button expand other buttons用一个按钮展开其他按钮
【发布时间】：2017-11-15 01:40:58
【问题描述】：

我的页面 HTML 上有很多按钮。当您单击按钮时，所有这些按钮都会扩展一些信息。

为了让它更有用，我想要一个唯一的按钮，展开其他按钮。

首先我尝试只显示一个带有主按钮的按钮，然后我会为其他按钮显示。

这就是我到目前为止所做的，它显示不同但它不会崩溃。

               <button class="btn btn-primary" type="button" id="collapseEveryButtons" data-target="collapseEveryButtons" data-toggle="collapse" aria-expanded="false" aria-controls="MonCollapse"><i class="glyphicon glyphicon-chevron-right"></i> Collapse</button>

                <button class="btn btn-primary" type="button" id="collapseForm1" data-target="#collapseForm1" data-toggle="collapse" aria-expanded="false" aria-controls="MonCollapse"><i class="glyphicon glyphicon-chevron-right"></i> Form1</button>
                <div id="collapseForm1" class="collapse">
                    <div class="form-group">
                        <label for="name1">Name :</label><br>
                        <input type="text" style="background-color:#bfbfbf;" disabled name="name1" class="form-control" id="name1" value="<?php echo $name1;?>">
                    </div> 
                    <div class="form-group">
                        <label for="email">Email :</label><br>
                        <input type="text" style="background-color:#bfbfbf;" disabled name="email" class="form-control" id="email" value="<?php echo $email;?>">
                    </div>
               </div>

                   <script type="text/javascript">
                    <!-- Change the color of the button when it's open-->
                        $('#collapseEveryButtons').click( function(){
                            $('#Form1').find('i').toggleClass('glyphicon glyphicon-chevron-right').toggleClass('glyphicon glyphicon-chevron-down');
                            $('.btn btn-open').not(this).removeClass('btn-open');
                            $('#collapseAnneesRenovation').toggleClass('btn-open-collapsed');
                            $("#collapseAnneesRenovation").attr("aria-expanded",true);
                            var $collapse = $('#collapseAnneesRenovation').find('.collapse');
                            $collapse.collapse('toggle');
                        });
                    </script>

这里展示了如何只打开一个按钮

                       $('#collapseForm1,#collapse2,#collapse3').click( function(){
                            $(this).find('i').toggleClass('glyphicon glyphicon-chevron-right').toggleClass('glyphicon glyphicon-chevron-down');
                            $('.btn btn-open').not(this).removeClass('btn-open');
                            $(this).toggleClass('btn-open');
                        });

感谢您的帮助。

【问题讨论】：

Expand buttons ....?如何？你想达到什么目的？您的问题不清楚...请创建一个可运行的 sn-p 来显示您的问题。
你应该总是用英文输入变量名、注释、类名……。或者至少，把它们用英语写在这里。很多非法国人会读你的代码却看不懂
好的，我改成英文。我英语不流利，所以我尽力而为。很多按钮打开表格的东西，但你需要一个一个打开。我只想用一个主按钮打开所有按钮。希望你能理解

标签： javascript php jquery button collapse

【解决方案1】：

没关系，我解决了，但还是有问题

<div id="anneesRenovationCollapse" class="collapse">
                        <div class="form-group">
                            <label for="name">Name :</label><br>
                            <input type="text" style="background-color:#bfbfbf;" disabled name="name" class="form-control" id="immeuble_n_anne_toit" value="<?php echo $name;?>">
                        </div> 
</div>

<script type="text/javascript">
                        $('#collapseEveryButtons').click( function(){
                        $('#collapseAnneesRenovation').find('i').toggleClass('glyphicon glyphicon-chevron-right').toggleClass('glyphicon glyphicon-chevron-down');
                        $('.btn btn-open').not(this).removeClass('btn-open');
                        $('#collapseAnneesRenovation').toggleClass('btn-open-collapsed');
                        $("#collapseAnneesRenovation").attr("aria-expanded",true);
                        $('#anneesRenovationCollapse').find('.collapse');
                        $('#anneesRenovationCollapse').toggleClass('collapse collapse in');
});
</script>

现在我用主要的“anneesRenovationCollapse”打开所有按钮，但是当一个按钮已经打开时，它会关闭按钮并打开那些关闭的按钮。希望你能理解。

【讨论】：