Jquery鼠标悬停功能未触发

时间:2011-06-03 14:43:37

标签: javascript jquery html css popup

我有这个Jquery代码:

$(document).ready(function() {

    // Do menu mouseovers
    $('.bar a').each(function() {

        var Link = $(this);
        var LinkID = Link.attr("ID");

        $('.menu-pop').each(function() {
            var PopID = $(this).attr("data-for");

            // We have found a match, assign events
            if (PopID == LinkID) {

                Link.mouseover = (function() {
                    alert("trucks lol");
                });

                return;
            }
        });

    });

});

这是我正在写的弹出菜单。菜单的简化结构是:

<div class="bar">
    <a class="item">Home</a>
    <a class="item" id="mnuAnother">Another Link</a>
</div>

<div class="menu-pop" data-for="mnuAnother">
    Links and stuff
</div>

当我的鼠标越过“另一个”链接时,我希望它能够发出警报,但目前它不会抛出任何错误/没有警报。

任何帮助表示感谢。

3 个答案:

答案 0 :(得分:4)

你试过吗

Link.mouseover(function() {
  alert("trucks lol");
});

(使用jQuery鼠标悬停功能,这是绑定鼠标悬停事件的快捷方式)

答案 1 :(得分:1)

请参阅: http://jsfiddle.net/rQ72v/

改变这个:

Link.mouseover = (function() {
    alert("trucks lol");
});

到此:

Link.mouseover(function() {
    alert("trucks lol");
});

Link.mouseover =没有任何意义。

在原始JavaScript方面,Link.onmouseover =可能会起作用(或者您需要Link[0].onmouseover =?)。

但是,使用jQuery的.mouseover()更好。

答案 2 :(得分:0)

我会替换

// ...
$('.bar a').each(function() {
    var Link = $(this);
// ...

按行

// ...
$('.bar a').each(function(item) {
    var Link = $(item);
// ...