Welcome to JiKe DevOps Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
473 views
in Technique[技术] by (71.8m points)

这里的alert为什么会出现两次,而且结果还不一样

<script>
        $(document).ready(function(){
            $(document).scroll(function(){
                alert($('#d2').offset().top-$(document).scrollTop());
            });
        });
    </script>

上面代码中的alert出现了两次,而且结果还不一样,如下图
图片描述
图片描述

这是为什么?第二张图的结果是我需要得到的结果,但是第一次出现的是什么?怎么可以解决。

完整代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <style>
        body{height:5000px;}
        #d1{background:#123;height:500px;}
        #d1{background:#321;height:50px;}
    </style>
    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.12.4/jquery-1.12.4.min.js"></script>
</head>
<body>
    <div id="d1"></div>
    <div id="d2"></div>
    <script>
        $(document).ready(function(){
            $(document).scroll(function(){
                alert($('#d2').offset().top-$(document).scrollTop());
            });
        });
    </script>
</body>
</html>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

Please log in or register to answer this question.

1 Answer

0 votes
by (71.8m points)

scroll 事件本来就是高频度的触发, 得到2次很正常。


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to JiKe DevOps Community for programmer and developer-Open, Learning and Share
...