2014-10-31 67 views
0

我試圖從一個已經存在的選擇創建一個隨機選擇,但它不像預期的那樣工作。jquery append無法正常工作

它移除原始元素某種原因,我很困惑,爲什麼

http://jsfiddle.net/t1dukhwz/51/

var sizeofmenu = $('.random_menu').children().length; 
var myArr = new shuffle(ArrMap(0,sizeofmenu)); 

var newmenu = $('.new_menu'); 
$(myArr).each(function(i,v) { 
//console.log(v); 
    newmenu.append($('.random_menu').children().eq(v)); 



}); 

function ArrMap(start, count) { 
    if(arguments.length == 1) { 
     count = start; 
     start = 0; 
    } 

    var foo = []; 
    for (var i = 0; i < count; i++) { 
     foo.push(start + i); 
    } 
    return foo; 
} 


function shuffle(o){ 
    for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x); 
    return o; 
}; 

回答

1

所以發生了什麼事是:當你引用$('.random_menu').children().eq(v)它指的是在DOM實際元素。因此,如果您將該元素附加到其他位置(在本例中爲'.random_menu'),則將其從當前位置移除並附加到新位置。這樣做的副作用是數組的大小縮小一個,並且你隨機化的索引被吹到地獄。

爲了避免這種情況,你可以簡單地複製原始數組,像這樣:

var original = $('.random_menu').children().clone(); 
var sizeofmenu = original.length; 
var myArr = new shuffle(ArrMap(0,sizeofmenu)); 

var newmenu = $('.new_menu'); 
$(myArr).each(function(i,v) { 
    newmenu.append(original.eq(v)); 
}); 

小提琴:http://jsfiddle.net/t1dukhwz/58/

0

我剛剛調整您的Fiddle改變

newmenu.append($('.random_menu').children().eq(v)); 

newmenu.append($('.random_menu').children().eq(v).clone());