Javascript 滚动列表后，jQuery鼠标事件不起作用

我有一个高度为240px的div，它有一个隐藏的溢出（css attr.）。当用户按下按钮时，div向上滚动到之前隐藏的其他内容。当用户离开这个div时，我希望它滚动回默认内容。但是，jQuery鼠标事件不起作用。。。有人知道为什么吗？这是我的密码：

<div id="wrapper">
    <ul>     
        <li id="centerhover">
            <div class="welcomemsg">
                welcome info
            </div>

        <div class="share">
            <ul>
                <li>share 1</li>
                <li>share 2</li>
            </ul>
        </div> 
        </li>
        <li id="center">
            <div id="pull"></div>
        </li>   
    </ul>
</div>

欢迎信息

分享1
分享2

显示的初始内容位于id为“center”的列表项中。当用户按下id为“pull”的div时，应显示id为“centerhover”的列表项中的内容。下面是它背后的Javascript：

$(document).ready(function() {
        $("#pull").click(function() {
            return gotoPage(0);
        });

        $("centerhover").click(function() {
            return gotoPage(1);
        });

        function gotoPage(page) {
            var visible = Math.ceil($("#wrapper").innerHeight() / 240);
            var currentpage = 1;
            if (page == 1) {
                currentpage = 0;
            }
            var dir = page < 1 ? -1 : 1;
            var n = Math.abs(currentpage - page);
            var top = 240 * dir * visible * n;
            $("#wrapper").filter(':not(:animated)').animate({
                scrollTop : '+=' + top}, 500, function() {
                    if (page == 1) {
                        $("#wrapper").scrollTop(240);
                    } else {
                        $("#wrapper").scrollTop(-240);
                    }
            });
            return false;
        }

        var center = document.getElementById("center");
        var wrapper = document.getElementById("wrapper");
        wrapper.scrollTop = center.scrollHeight;
        setTimeout(function() {
            T.preload(0);
            T.poll(0);
        }, 1000);
    });

$（文档）.ready（函数（）{
$（“#拉动”）。单击（函数（）{
返回gotoPage（0）；
});
$（“中心悬停”）。单击（函数（）{
返回gotoPage（1）；
});
函数gotoPage（第页）{
var visible=Math.ceil（$（“#包装器”）.innerHeight（）/240）；
var currentpage=1；
如果（第==1页）{
currentpage=0；
}
var dir=页面<1？-1:1；
var n=Math.abs（当前页-第页）；
var top=240*dir*可见*n；
$（“#包装”）。过滤器（'：非（：动画）。动画({
scrollTop:'+='+top}，500，函数（）{
如果（第==1页）{
$（“#包装器”）.scrollTop（240）；
}否则{
$（“#包装器”）.scrollTop（-240）；
}
});
返回false；
}
var center=document.getElementById（“中心”）；
var wrapper=document.getElementById（“wrapper”）；
wrapper.scrollTop=center.scrollHeight；
setTimeout（函数（）{
T.预载（0）；
T.poll（0）；
}, 1000);
});

---

有人有主意吗？我试过鼠标，点击和其他活动。。。谢谢

第一步只是指出对脚本的一些更改，我看不到有人试图将“mouseleave”事件绑定到现有脚本，我将在下面修改的代码下面列出您想要做的事情（请所有Flamer注意：这是修复一些语法问题的20秒步骤，我将在时间允许的情况下进行重构）

---

哇！通常我会给出一个答案，但上面脚本中错误问题的数量可能是问题的一部分，如果不是全部的话。首先也是最重要的一点，如果您使用JQuery，为什么要使用document.get*。使用var wrapper=$（“#wrapper”）；此外，您的事件关联需要使用$（“#wrapper”）.bind（“mouseleave”，function（）{……}）；如果我记得今晚晚些时候，没有人过来接受我在这里说的话并做出回答，我会给你你的解决方案。好的。。我犯了一些愚蠢的错误，而你的解决方案有效！然而，我有一些问题。mouseleave上的绑定和jQuery mouseout（）函数之间有什么区别？我不知道为什么我混合了纯jQuery和Javascript，但有那么糟糕吗？：）谢谢首先，如果使用JQuery，请不要将其与getElementBy*代码混合使用。JQuery可以处理您可能遇到的所有跨浏览器问题，而straight javascript则不能。所以是的，有那么糟糕。关于下一个问题，您可以在JQuery.com上阅读关于差异的完整描述，但是mouseleave/mouseout的行为只是略有不同。我想上面的示例将与“mouseout”一起使用，它只是绑定调用修复了这个问题。很高兴它起作用了，因为我没有完成重构，但昨晚我没有抽出时间去做。干杯

$(document).ready(function() {
        $("#pull").click(function() {
            return gotoPage(0);
        });

        $("#centerhover").click(function() {
            return gotoPage(1);
        });

        function gotoPage(page) {
            var visible = Math.ceil($("#wrapper").innerHeight() / 240);
            var currentpage = 1;
            if (page == 1) {
                currentpage = 0;
            }
            var dir = page < 1 ? -1 : 1;
            var n = Math.abs(currentpage - page);
            var top = 240 * dir * visible * n;
            $("#wrapper").filter(':not(:animated)').animate({
                scrollTop : '+=' + parseInt(top)}, 500, function() {
                    if (page == 1) {
                        $("#wrapper").scrollTop(240);
                    } else {
                        $("#wrapper").scrollTop(-240);
                    }
            });
            return false;
        }

        var center = $("#center");
        var wrapper = $("#wrapper");
        wrapper.scrollTop(center.scrollTop());
        setTimeout(function() {
            T.preload(0);
            T.poll(0);
        }, 1000);
    });

$("#wrapper").bind("mouseleave", function(){
    $(this).scrollTop(0);
});