0

我想在单击按钮时滚动页面。下面的代码在没有 sweetalert.js 和 sweetalert.css 的情况下可以正常工作。首先页面滚动到顶部,但是当我从警报框中单击确定按钮时,页面会自动向下滚动。请从此链接下载 sweetalert.js 和 sweetalert.css 。

<html>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"> </script>
        <script src="js/sweetalert.min.js"></script>
    <link rel="stylesheet"  type="text/css" href="css/sweetalert.css"/>
    <script>
$(document).ready(function (){
    $("#click").click(function (){

        $('html, body').animate({
                    scrollTop: $("#div1").offset().top
                }, 2000);

        swal({
            title: "This is title",
            text: "Some error occurred",
            type: "error",
            confirmButtonText: "Ok"
        });
        window.scrollTo(0, 100);
            });
});
    </script>
    <div id="div1" style="height: 900px; width 100px">
    Div1 is here.
    </div>
    <br/>
    <div id="div2" style="height: 900px; width 100px">
    Div2 is here.
</div>
    <button id="click">Click here</button>
</html>
4

1 回答 1

1

我不确定您的输出需要如何。但是把你的滚动放在确认回调上,这样当用户点击 Sweetalert 确认警报时页面就会滚动。以下是编辑后的代码。

$(document).ready(function (){
    $("#click").click(function (){
        swal({
            title: "This is title",
            text: "Some error occurred",
            type: "error",
            confirmButtonText: "Ok"
        }, function(){
            $('html, body').animate({
                    scrollTop: $("#div1").offset().top
                }, 2000);
            window.scrollTo(0, 100);
        });
    });
});

或者

单击后将其保持在顶部的另一个技巧

$(document).ready(function (){
    $("#click").click(function (){
        $('html, body').animate({
                    scrollTop: $("#div1").offset().top
                }, 2000);

        swal({
            title: "This is title",
            text: "Some error occurred",
            type: "error",
            confirmButtonText: "Ok"
        }, function(){
            $('html, body').animate({
                    scrollTop: $("#div1").offset().top
                }, 100);
        });
    });
});
于 2015-12-16T05:22:08.320 回答