1

我有一个简单的脚本,其中一个按钮包含在一个带有标签 ID 的 DIV 中。悬停时显示另一个具有内容 id 的 div。两个 DIV 都包含在 ID 为 basket-top 的 DIV 中。悬停调用附加到此 div。这是HTML:

<div id="basket-top">
    <div id="content"><br />
            <br />
            content here<br />
            <br />
    </div>
    <div id="label">label here</div>
</div><!-- /basket-top -->

这是JS:

$("#basket-top").hover( function () {
    $("#basket-top #content").slideDown(500);
}, function () {
    $("#basket-top #content").slideUp(500);
});

这工作正常,直到用户快速进出,一遍又一遍地调用该函数并且图层上下滑动几次。如果前一个动作没有完成,有没有办法阻止函数被调用?

4

2 回答 2

0

首先,"#basket-top #content"这是不必要的,因为 ID 必须是唯一的。"#content"足够了。其次,参见 jQuery 的.stop()函数。

$("#basket-top").hover( function () {
    $("#content").stop(true,true).slideDown(500);
}, function () {
    $("#content").stop(true,true).slideUp(500);
});
于 2013-02-05T17:03:52.163 回答
0

content当您将鼠标悬停在上方时,这将显示除法label

$("#content").hide();
$("#label").hover(function () {
    $("#content").stop(true, true).slideDown(500);
}, function () {
    $("#content").stop(true, true).slideUp(500);
});

JsFIDDLE 在这里

另外,在旁注中,您应该仔细检查您在此处提出的所有问题并接受正确的答案。当您发布新问题时,这将使其他人想要帮助您。并感谢那些花时间帮助你的人。

于 2013-02-05T17:18:49.223 回答