我不能使用滑动切换答案

【问题标题】：I can't use slidetoggle我不能使用滑动切换
【发布时间】：2018-06-08 20:41:55
【问题描述】：

<body ng-controller="ChatController">
    <br>
    <div class="container">
        <div class="panel panel-primary" id="container">
            <div class="panel-heading">Web Based Firebase Chat Application</div>
            <div class="panel-body">
                <p ng-repeat="m in messages">{{m.message}} - {{m.date | date:'medium'}}</p>
                <div class="form-group">
                    <input type="text" class="form-control" placeholder="Message here..." ng-model="messageText">
                </div>
                <button type="submit" class="btn btn-default" ng-click="send()">Send</button>
            </div>
        </div>
    </div>
</body>
<script>
    $(document).ready(function () {
         $("#container").click(function () {
             $(this).next('#container').slideToggle("slow");
         }); });
</script>

【问题讨论】：

标签： javascript html css angularjs

【解决方案1】：

您的代码当前所说的是：“单击#container 时，找到下一个元素#container 并切换它”。

这不行，在id为“container”的元素旁边没有其他#container元素。

所以只需删除 .next('#container') 部分，然后单击容器将滑动切换它。

<body ng-controller="ChatController">
    <br>
    <div class="container">
        <div class="panel panel-primary" id="container">
            <div class="panel-heading">Web Based Firebase Chat Application</div>
            <div class="panel-body">
                <p ng-repeat="m in messages">{{m.message}} - {{m.date | date:'medium'}}</p>
                <div class="form-group">
                    <input type="text" class="form-control" placeholder="Message here..." ng-model="messageText">
                </div>
                <button type="submit" class="btn btn-default" ng-click="send()">Send</button>
            </div>
        </div>
    </div>
</body>
<script>
    $(document).ready(function () {
         $("#container").click(function () {
             $(this).slideToggle("slow");
         }); });
</script>

另外请记住，隐藏容器时，您不能切换（再次显示）它，因为它现在完全隐藏并且根本不可点击。

【讨论】：