0

I've got an unimaginably huge order form that I'm combing through for values and building an array from. Amongst other things, I've got some each() iterations that I need to extract values from, appending them to variables that are used afterwards. Problem is that the values are returning undefined, which I think is because they're being assigned within the loop.

Here's my logic:

  • Declare variables
  • loop through each
    • assign value to variable
  • post to array

My understanding is that the variable declaration outside the function allows me to use it globally. Guess I'm wrong!

Here's a jsFiddle: http://jsfiddle.net/x7CL6/

Here's the code:

$('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);
});
​
4

1 に答える 1

0

「私の理解では、関数の外側で変数を宣言すると、グローバルに使用できるようになります。」

宣言が関数の外にある場合、変数はグローバルです。each()あなたの場合、すべての変数はクリック ハンドラー関数内で定義されているため、すべての変数と、コールバックを含むネストされた関数内でアクセスできます。

クリックごとに別のオブジェクトを配列に追加することが意図されている場合は、クリック ハンドラーの外側testで定義する必要があります。test

変数が定義されていない理由は、if/else 条件が常に false であるため、変数に値が割り当てられないためです。val変数には、ループの現在の要素からの html コンテンツが割り当てられます。html コンテンツは、比較する 、 などの文字列と"1"決して等しくありません。"2"

kind代わりに、変数に入れた各要素のクラス属性と比較するつもりだったと思います。

if (kind === "1")

など: http://jsfiddle.net/x7CL6/4/

.each()...しかし、ドキュメントの順序で要素を処理しているように見える場合、jQuery がコールバックに現在の要素のインデックスを渡すという事実を利用できます。

$('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/

于 2012-12-04T02:14:32.710 に答える