jquery在函数外传递变量值

Question

我有一个难以想象的巨大订单表格，我正在梳理它的值并从中构建一个数组。除其他外，我有一些each() 迭代，我需要从中提取值，将它们附加到以后使用的变量中。问题是这些值返回未定义，我认为这是因为它们是在循环中分配的。

这是我的逻辑：

• 声明变量
• 循环遍历每个
  • 为变量赋值
• 发布到数组

我的理解是函数外的变量声明允许我全局使用它。我猜我错了！

这是一个 jsFiddle：http://jsfiddle.net/x7CL6/

代码如下：

$('a').click(function(event){

    event.preventDefault();   

/* Declare Variables */

    var test = [],
        one,
        two,
        three,
        four,
        el,
        kind,
        val;

/* Loop through each paragraph */

    $('section').find('p').each(function(){

        el   = $(this);
        kind = el.attr('class');
        val  = el.html();

        if (val === '1'){

            one = val;
        } else if (val === '2'){

            two = val;
        } else if (val === '3'){

            three = val;
        } else if (val === '4'){

            four = val;    
        }
    });

    test.push({
        one: one,
        two: two,
        three: three,
        four: four
    });

    console.log(test);
});
​

Answer 1

“我的理解是函数外的变量声明让我可以全局使用。”

如果变量的声明在any 函数之外，则该变量是全局变量。在您的情况下，您的所有变量都在 click 处理程序函数中定义，因此所有变量都可以在其中访问，任何嵌套函数包括您的 each() 回调。

如果意图是每次点击都应将另一个对象添加到test 数组，那么您需要在点击处理程序外部定义test。

您的变量未定义的原因是您的 if/else 条件始终为 false，因此变量永远不会被赋值。您的 val 变量从循环的当前元素中获得 html 内容，并且 html 内容永远不会等于您与之比较的 "1"、"2" 等字符串。

我认为您可能打算改为与每个元素的 class 属性进行比较，您已将其放入 kind 变量中：

if (kind === "1")

等等：http://jsfiddle.net/x7CL6/4/

...但是考虑到您似乎是按文档顺序处理元素，您可以利用 jQuery 将您的 .each() 回调传递给当前元素的索引这一事实：

$('section').find('p').each(function(i){ // add i param
    // inside the loop test i (note it starts with 0)
    // instead of testing val or kind

演示：http://jsfiddle.net/x7CL6/2/

但是，这仍然会给您留下一个丑陋的 if/else if/... 结构，您可以像这样避免：

var test = [],
    propNames = ["one","two","three","four"],
    obj = {};

$('section').find('p').each(function(i){
    obj[ propNames[i] ] = $(this).html();
});

test.push(obj);

演示：http://jsfiddle.net/x7CL6/5/