开发者

jquery loop to create dynamic-multiple vars

I am not sure if this is possible, but I want to create a multiple vars dynamically, for instance, these are the vars I create manually,

var left_1 = $('.column-global.left .item-global').eq(0);
var left_2 = $('.column-global.left .item-global').eq(1);
var left_3 = $('.column-global.left .item-global').eq(2);

but the problem is I only need two or one vars above sometimes. but three is the max.

so I am thinking of passing a parameter into the function to tell the code to create either 2 or 3 vars,

// I declare empty vars first
var left_1;
var left_2;
var left_3;

// get the number from somewhere, from the class for instnace
var last_class = $(this).attr("class").split(' ').slice(-1); 

// loop the number with for loop
for( var i = 1; i <= last_class; i++){
    left_1 = $('.column-global.left .item-global').eq(i-1);
}

but you notice that I am stuck - how can I loop the var in the {} of the for-loop?

basically I want the for loop to produce the multiple vars like these (same as above),

var left_1 = $('.column-global.left .item-global').eq(0);
var left_2 = $('.column-global.left .item-global').eq(1);
var left_3 = $('.column-global.left .item-global').eq(2);

is it possible??

thanks.

开发者_Go百科

p.s.

some answers here suggesting an array, but I have another problem further...

bcos I also need to pass the vars into another function which is kept within that parent function like this,

another_function(left_1, left_2, left_3); 

so how can I achieve this with the array?? thanks


Instead of running the same selector 3 times and pulling out the item you want one at a time, why not just run it once and store that jQuery object?

var $globals = $('.column-global.left .item-global')

Then you can use whichever element(s) you need when you want.

$globals.eq(1).doSomething();

Or because a jQuery object is an Array-like object, you can get each individual DOM element by index, like:

$globals[1] // to get the actual non-jQuery wrapped DOM element

EDIT: With regard to the update in your question, first I'd rework the function if possible to accept 1 jQuery object.

If that is not possible, and you just need to pass individual arguments, I'd do one of two things.

First idea.

If possible, change the function so that it can accept DOM elements, then wrap them inside the function:

var $globals = $('.column-global.left .item-global');

another_function.apply( this, $globals.get() );

another_function(left_1, left_2, left_3) {
      // Wrap the DOM elements
    for( var i = 0, len = arguments.length; i < len; i++ ) {
        arguments[ i ] = $( arguments[ i ] );
    }
    // ...the rest of the code
}

By calling your another_function with .apply(), you're able to pass an Array of arguments, which will be assigned to the various parameters for the function.

Here we used jQuery's .get() method to pass an Array of DOM elements.

Second idea.

If you absolutely must accept individually wrapped DOM elements, do the same as above, but create the Array of individually wrapped elements like this:

var $globals = $('.column-global.left .item-global').map(function() {
    return $(this);
});

another_function.apply( this, $globals.get() );

This uses .map() to create a jQuery object of jQuery objects, then uses .get() to pull the Array out of the object.

But really I'd change your another_function if possible.


Why not use an array?

var left = []

for( var i = 1; i <= last_class; i++){
     left[i] = $('.column-global.left .item-global').eq(i-1);
}

or more likely, since arrays are 0-based:

for( var i = 0; i < last_class; i++){
     left[i] = $('.column-global.left .item-global').eq(i);
}i
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜