Question

使用jquery在单击按钮时展开div，这是按钮代码：

<input type="button" value="Reply" onclick="jQuery('#replycont').slideToggle()" /＆gt;

然后显然是实际的div：

<div id="replycont" style="display:none; border:1px #000000 solid; padding:10px;">
<form method="post" action="index.php?id=viewticket&seq=<?php echo $_GET["seq"]; ?>#updates_bottom" enctype="multipart/form-data" class="form-stacked">
        <div class="control-group">
            <label class="control-label bold" for="message">Message</label>
            <div class="controls">
                <textarea name="ticket_update" id="ticket_update" rows="12" style="width:100%;"></textarea>
            </div>
        </div>
    <p><input type="hidden" name="ticketnumber" id="ticketnumber" value="<?php echo $_GET["seq"]; ?>" />
    <input type="submit" name="addupdate" id="addupdate" value="Submit" /></p>
</form>
</div>

按钮位于页面的顶部，然后div位于底部，这是使页面滚动到底部的最佳方式，因此div可见以及扩展div的按钮？ / p>

Answer 1

最好不要使用内联js，为你的按钮添加一个id，然后

$('#mybutton').on('click',function(){
$('#replycont').slideToggle(function(){
$('html, body').animate({
    scrollTop: $('#replycont').offset().top
}, 500);
});
});

你走了，动画将在切换完成后启动，如果你想让它同时运行，

 $('#mybutton').on('click',function(){
$('#replycont').slideToggle();
$('html, body').animate({
    scrollTop: $('#replycont').offset().top
}, 500);
});

Answer 2

$('html,body').animate({
    scrollTop: $('#replycont').offset().top
})

JQuery Div扩展并滚动到底部

2 个答案: