javascript - 如何在javascript中遍历循环

Question

我有三个盒子，每个都淡入，摇晃然后淡出。每个保留在数组中的 ID 和循环遍历它们，循环正常工作，但只显示第一项！。

我已经使用 for loop,delay 而不是 setTimeout 以不同的方式检查了 javascript。我还尝试在 html 中添加框而不是在 js 文件中（如果它引起任何问题！！！！！！！！！）

这是我的代码：http: //jsfiddle.net/#&togetherjs=QLRAbwHOR7

任何人都可以帮助我吗？？？？

      $(document).ready(function(){ 
            var imgID= ['red','green','blue'];
            $.each(imgID, function(i) {

                $(".image").append('<div class="box"fid="'+i+'">'+imgID[i]+'</div>');
                $('#'+i).fadeIn(500);
                setTimeout(function(){
                $('#'+i).effect( "shake",{times:5}, 1000 ).fadeOut(500);
                }, 1000);
                alert("ID: "+i);
            }); 
      });

Answer 1

基于问题中的代码（不是jsfiddle链接）我认为问题出在这一行

$(".image").append('<div class="box"fid="'+i+'">'+imgID[i]+'</div>');
                                    ^

应该

$(".image").append('<div class="box" id="'+i+'">'+imgID[i]+'</div>');
                                    ^ remove the 'f'

这是我的小提琴结果 http://jsfiddle.net/jasrus/ZqayT/

更新还要确保包含 jQueryUI，因为effect它不是 jquery 库的一部分