Javascript很奇怪 - 我很无能为力

时间:2012-07-25 21:36:25

标签: javascript variables for-loop override

我正在研究这个菜单系统,它与操作系统的操作系统非常相似。 使用jquery等。

我在For循环中有2条评论。它基本上是在$(document).on('click')...函数中输出最后一个索引。但是在文档之外。它工作正常。

这可能只是一个明显的问题,但我已经花了大约一个小时......提前谢谢!

    menu: function(title) {
        this.title = title;
        this.slug = slugify(title);
        this.icon = false;
        this.buttons = Object();
        this.num_buttons = 0;
        this.visible = false;
        this.timeout_id = null;
        this.is_hovering_dropdown = false;
        this.is_hovering_menu = false;


        this.render = function() {
            var that = this;
            var slug = that.slug;
            var str = '<li id="menu-' +slug +'"><a href="#" id="menu-toggle-' +slug + '">' + this.title + '</a>';

            if (this.num_buttons > 0) {
                str += '<ul id="menu-dropdown-' + slug + '" style="display: none;" class="dropdown">';
                for (var button in this.buttons) {

                    str += '<li><a href="#" id="menu-dropdown-' + slug + '-' +that.buttons[button]['slug'] +'">' +that.buttons[button]['title'] +'</a></li>'

                    alert(button) //new project, open project, save as etc.
                    $(document).on("click", "#menu-dropdown-" +slug + '-' + that.buttons[button]['slug'], function() {
                        $("#menu-dropdown-" + slug).hide("fade", 200);
                        that.visible = false;

                        alert(button);//save as, save as, save as, save as etc.
                    });
                }
            }
        }
    }

1 个答案:

答案 0 :(得分:1)

你走了:

由于操作顺序和作用域,所有按钮都被保存,并引用了button LAST 值。

你想要做的是将该赋值放在一个立即调用的函数中,并将该按钮传递给该特定的函数范围。

(功能(按钮){$(文件)。// ......}(按钮));

立即函数内部的所有内容仍然可以访问立即函数范围之外的静态内容(即:that), AND 它也会引用 当前 button的值,因为它正在被调用。

故事的较长版本是您的按钮在创建时被赋予引用button,而不是 <{1}}的{​​{1}},因此,当它们在以后实际调用时,它们会引用当前存在的按钮值(即:它在循环中分配的最后一个值)。