JQuery myArray[myVarriable] 未定义，即使我已经定义了它

Question

好吧，让我告诉你我想在这里做什么， 有 4 个对象，与此类似：

var links = {name: "Links", id: "links", index: 0};

我将它们放在一个数组中：

var pages = [links,about,projects,contact];

我创建了这个函数：

function active_page(selected){
  var active = 0;
  $("[id="+pages[selected].id+"]").show();
}

然后我运行 active_page(0) in

$(function(){
  active_page(active);
});

并且我收到此错误：

pages[selected] is undefined

整个 .js 文件在这里： http://pastebin.com/2rBWiVJF

我收到的错误位于第 26 行，

谢谢您的宝贵时间

Answer 1

这是一个常见问题。实际问题在于您的 clicked() 函数。

for 循环不会创建新的作用域，因此您始终引用相同的 i 变量，该变量将在循环后保存最新值。

function clicked() {
    for (var i = 0; i < pages.length; i++) {
        $("[id=" + pages[i].id + "_btn]").mousedown(function (e) {
            if (e.which == 1) {
                // the "i" passed is always going to be the same as "pages.length"
                active_page(i);
                active = i;
            }
        });
    }
}

在 JavaScript 中确定变量作用域的唯一方法是在函数中。因此，您应该将 i 传递给新函数调用以确定其作用域。

function clicked() {
    // used to scope the value of "i", and return a function
    //     that references it.
    function createHandler(this_i) {
        return function (e) {
            if (e.which == 1) {
                active_page(this_i);
                active = this_i;
            }
        }
    }
    for (var i = 0; i < pages.length; i++) {
        $("[id=" + pages[i].id + "_btn]").mousedown(createHandler(i));
    }
}

Answer 2

var active = 0;
var pages  = [{name: "Links", id: "links"}, 
          {name: "About", id: "about"}, 
          {name: "Projects", id: "projects"}, 
          {name: "Contact", id: "contact"];

function active_page(selected){
   $('#' + pages[selected].id).show();
}

$(function(){
  active_page(active);
});