崩溃后如何自动滚动到页面底部?

时间:2016-10-27 13:03:53

标签: javascript html collapse autoscroll

我有这个使用bootstrap崩溃的元素。 当我点击此élément的“标题”时,它会打开并出现一个滚动条但我喜欢显示在底部。

我从stackoverflow尝试了很多解决方案,但似乎都没有。 我能做到吗?

<div class="row">
    <div class="col-sm-12">
        <div id="panel-profil" class="panel panel-info">
            <div id="panel-heading-profil" class="panel-heading text-center">
                <a id="link-heading-profil" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"
                   aria-expanded="false" aria-controls="collapseTwo" onclick="changeArrowProfil()">
                    <div class="row">
                        <div id="triangleUn" class="col-sm-1">
                            <span id="triangle1" class="glyphicon glyphicon-triangle-bottom"></span>
                        </div>
                        <div class="col-sm-10">
                            <span class="fa fa-truck fa-1"></span> Profil du véhicule

                        </div>
                        <div id="triangleDeux" class="col-sm-1">
                            <span id="triangle2" class="glyphicon glyphicon-triangle-bottom"></span>
                        </div>
                    </div>
                </a>
            </div>
            <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
                <div id="panel-body-profil" class="panel-body">
                    <label class="text-info" for="sel1">Longueur du véhicule :</label>
                    <form class="form-horizontal">
                        <div class="form-group form-group-sm">
                            <div class="col-sm-1"><img src="../img/B10a.png" height="35" width="35" ></img></div>
                            <input class="col-sm-2 control-label inputConstraint"
                                   for="formGroupInputSmall" type="text" value="6.00 m" autocomplete="off" id="value_length" readonly/>
                            <div class="col-sm-8 sliderConstraint"
                                 for="formGroupInputSmall">
                                <input type="range" min="0" step="1" max="3" value="0"
                                       id="value_length_slide"
                                       onchange="changeValue('length')" />
                            </div>
                        </div>
                    </form>
                    ...
                    ...
                </div>
                <div class="row" id="valid-param">
                    <div class="col-sm-12">
                        <button id="btn-valid-param" onclick="modifierProfileSaisi();" type="submit" class="btn btn-success btn-sm btn-block" > Valider les paramètres</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>

1 个答案:

答案 0 :(得分:0)

如果你使用onClick事件,那么在那个onClick中,写下这行代码,

window.scrollTo(0,document.body.scrollHeight);

这会将您滚动到页面底部。