0

我在 aspx 页面中有一个带有 class="._aHide" 的元素，它带有一条消息，并且反复显示。

<div id="Message1" class="._aHide" runat="server" visible="true"><p>My Message</p></div>
  • 如果可见属性 = true，则在页面加载时不会创建 aspx 服务器端元素。

我需要在显示 7 秒后隐藏这个 div，除非鼠标悬停。

我创建了这段代码

$(document).ready(function () {
    var hide = false;
    $("._aHide").hover(function () {
    clearTimeout(hide);
    });

    $("._aHide").mouseout(function () {
    hide = setTimeout(function () { $("._aHide").fadeOut("slow") }, 7000);
    hide;
    });

    $("._aHide").ready(function () {
    hide = setTimeout(function () { $("._aHide").fadeOut("slow") }, 7000);
    hide;
    });
});

但是这里有些不对劲

1-此代码仅工作一次，并且我多次显示此消息。

2-所有消息框一次隐藏，因为我不能在 settimeout 中使用 $(this) 并且我不知道为什么。

谢谢你的帮助，我真的很感激

4

2 回答 2

4

删除 HTML 代码中的点：

<div id="Message1" class="_aHide" runat="server" visible="true"><p>My Message</p></div>

见：http ://api.jquery.com/class-selector/

于 2012-11-10T23:26:26.967 回答
1

tbraun89 是对的，去掉“。” 在您的 html 代码中。

然后，您可以像这样简化代码：

JQuery hover有 2 个函数使用mouseenter和mouseleave

$(document).ready(function () {
    var hide = false;
    $("._aHide").hover(
    function () {
        //Cancel fadeout
        clearTimeout(hide);
    },
    function(){
         //re-set up fadeout
        clearTimeout(hide);            
        hide = setTimeout(function () { $("._aHide").fadeOut("slow") }, 7000);
    });

    //Set up fadeout
    hide = setTimeout(function () { $("._aHide").fadeOut("slow") }, 7000);
});
于 2012-11-10T23:29:31.910 回答