jquery - 滚动到 Bootstrap(2.3.2) 模式的底部

Question

您好，我正在尝试滚动到 Bootstrap 模式 onclick 的底部。到目前为止，除了移动页面的背面之外，我没有取得任何成功。有什么想法吗？

我看过: Autoscrolling a bootstrap modal on modal('show')
Twitter bootstrap scrollable modal

HTML

<div id="groupModal" class="modal fade">
    <div class="modal-footer">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 id="groupName"></h4>
    </div>
    <div class="modal-body">
        <div class="container-fluid">
            <div class="row-fluid">
            </div>
            <div id="interestedDiv" class="collapse">
                <form id="interestedForm">
                    <fieldset>
                        <legend>Interested Form</legend>
                        <input id="firstNameField" class="interestedField" type="text" placeholder="First Name" required>
                        <input id="lastNameField" class="interestedField" type="text" placeholder="Last Name" required>
                        <input id="emailField" class="interestedField" type="email" placeholder="Email" required>
                        <input id="phoneField" class="interestedField" type="tel" placeholder="Phone Number">
                        <button style="margin-bottom: 10px !important;" id="interestedSubmitButton" type="submit" class="btn btn-custom" disabled="true">Submit</button>
                    </fieldset>
                </form>
            </div>
        </div>
    </div>
    <div class="modal-footer">
        <div class="pull-left">
            <a id="interestedBtn" href="#" data-toggle="collapse" data-target="#interestedDiv"><i id="chevron" class="icon-chevron-right"></i> I'm Interested!</a>
        </div>
        <!--        <a href="#" data-dismiss="modal" class="btn btn-custom">Close</a>-->
    </div>
</div>

Javascript:

$('#interestedBtn').click(function(event){
    if($('#interestedDiv').hasClass('in')) {
        $('#chevron').attr('class', 'icon-chevron-right');
    } else {
        $('#chevron').attr('class', 'icon-chevron-up');
        $('#firstNameField').focus();
        $('#groupModal').animate({
            scrollTop: $('#groupModal').position().top + $('#groupModal').height()
        });
    }
});

Answer 1

我没有使用 javascript 就做到了.

FIDDLE

提示:添加 <a href="#"> <button /> </a>