Question

我已经建立了一个下拉菜单系统，一切都可以独立测试，我遇到的问题是在下面的代码中。我使用jQuery ready函数从外部数组（menubar []）构建菜单栏。在这里，我试图让mouseover事件调用dropdown（）函数，但为每个锚标记使用不同的参数。

所以滚动第一个应该调用dropdown（0），第二个下拉（1）等等。

$(document).ready(function () {
    for (i in menubar) {
        var declaration = '<a href="' + baseurl + '/' + menubar[i].url +
                          '" class="menutitle">' + menubar[i].name + '</a>';
        var a = $(declaration).mouseover(function () {
            dropdown(i);
        }).mouseout(function () {
            activeTimer = setTimeout("removedropdowns()", 100);
        });
        $("#menu").append(a);
    }
});

代码正在调用dropdown（6）;每次翻转。如何将循环变量（i）作为文字/静态值传递给鼠标悬停功能！

我使用

在FF中正常工作

.attr('onMouseOver','javascript:dropdown('+i+');')

但是对于某些版本的IE没有触发，所以我切换到jQuery鼠标悬停，它会触发，但我有上面的问题：（

Answer 1

您的实际问题是，每个鼠标悬停回调都使用相同 i，一直增加i一直到6，回调仍然指向相同的{ {1}}因此都使用i作为值。

您需要复制6的值，您可以使用匿名函数来完成此操作。

Answer 2

$(function() {
    $(menubar).each(function(i){
        $("#menu").append('<a href="' + baseurl + '/' + menubar[i].url + '" class="menutitle">' + menubar[i].name + '</a>');
    });

    $("#menu a").hover(
        function(){
            dropdown($(this).index());
        },
        function(){
            activeTimer = setTimeout("removedropdowns()", 100);
        }
    );
});

Answer 3

在JavaScript中，如果您未声明变量，则会全局定义。要解决此问题，请在此循环变量前面添加“var”。更新：当Sime注意到（见注释）时，你还需要将变量传递给函数，否则你在i上形成一个闭包。

$(document).ready(function() {
    for(var i in menubar) {
        var declaration = '<a href="' + baseurl + '/' + menubar[i].url + '" class="menutitle">' + menubar[i].name + '</a>';
        var a = $(declaration).mouseover(function(i) { dropdown(i); }).mouseout(function() { activeTimer = setTimeout("removedropdowns()", 100); });
        $("#menu").append(a);
    }
});

Answer 4

首先，不要使用for..in，而应使用普通循环。

其次，我只是先附加链接，然后再应用事件：

$(document).ready(function() {
    for (var i = 0; i < menubar.length; i++) {
        $("#menu").append('<a href="' + baseurl + '/' + menubar[i].url + '" class="menutitle">' + menubar[i].name + '</a>');
    }

    $("#menu a").each(function(index) {
        $(this).mouseover(function() { dropdown(index); }).mouseout(function() { activeTimer = setTimeout("removedropdowns()", 100); });
    });
});

Answer 5

查看here和here。

要捕获i的当前值，您需要将其作为参数传递给另一个函数，在该函数中它可以作为局部变量捕获：

Answer 6

尝试使用jQuery的each()函数：

jQuery(function() {
  jQuery.each(menubar, function(index, element) {
    var declaration = '<a href="' + baseurl + '/' + element.url + '" class="menutitle">' + element.name + '</a>';
    var a = $(declaration).mouseover(function() { dropdown(index); }).mouseout(function() { activeTimer = setTimeout("removedropdowns()", 100); });
    $("#menu").append(a);
  });
});

在函数内部使用循环变量，javascript范围混乱

6 个答案: