jQuery each回调函数

Question

如何在jQuery each函数中使用回调？

我正在尝试以下代码：

$.each(images, function(key, value) { 
    new_images+= '<li><a href="'+value+'"><img src="'+value+'" alt="'+[key]+'" /></a></li>';
}, function (){
    $('#Gallery').remove();
    $('body').append('<ul class="gallery">'+new_images+'</ul>');
});

- NoNameZ

---

为什么需要回调函数？如果你想在同步的.each()之后执行一个操作，只需在.each()后编写你的代码即可。 - devnull69

为什么要使用两个函数？each函数不支持这样做。相反，应该将第二个函数的语句包含在第一个函数中。 - SexyBeast

.each 只接受两个值（一个集合和一个函数），但你传递了三个值（集合(?), 函数, 函数）。你想要做什么？ - yoozer8

@devnull69 这个数组很大（大约有300张图片），所以可能需要一些时间... 不使用回调函数是否好？ - NoNameZ

@devnull69 如果涉及DOM方法怎么办？如何解决？ - Loki

Answer 1

$.each() 是一个同步函数。这意味着你不需要在其内部使用回调函数，因为任何写在 $.each() 后面的代码都会在 $.each() 结束后运行。

- Damian SIlvera

---

混淆的原因是人们（误）使用“回调”一词来指代任何传递函数引用的时间，无论该函数是否随后异步调用。 - Alnitak

@Alnitak 我直觉上认为回调是某种触发器，用于在特定的块/函数/进程/动画完成后执行代码。如果这不正确或者只是不完整的解释，您能否向我推荐一些文档，帮助我更好地理解这个概念？您所做的评论完全让我困惑了，主要是因为我仍在努力学习所有这些“行话”。 - Fernando Silva

@FernandoSilva 嗯，例如查看 Array.prototype.map 的 MDN 文档 - https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map - 它们称提供的函数为 callback，即使它不是“某个之后调用的东西”。 - Alnitak

@Alnitak 所以你的意思是回调函数只是对将在传递该引用的函数内执行的函数的引用？Array.prototype.map循环遍历数组，并在给定某些条件的情况下执行传递的callback函数。因此，我们通常在jQuery中看到的callback只是一种引用函数的方式，通常在成功或完成后触发，例如动画，这就是人们通常将callback术语与事件类型联系起来的方式？这正确吗？ - Fernando Silva

@Alnitak，你让我开始思考了。如果我想要实现回调行为，在PHP中我会这样做：function foo($callback){//do something; $callback();}，那么在JavaScript中我该如何实现呢？是这样吗？function jsFoo(callback){//do something; callback();} - Fernando Silva

你确定吗？实际上我还有些困惑。 - Saiful Islam

Answer 2

这段代码有什么问题？你不需要为$.each使用回调函数。

$.each(images, function(key, value) { 
    new_images+= '<li><a href="'+value+'"><img src="'+value+'" alt="'+[key]+'" /></a></li>';
});

$('#Gallery').remove();
$('body').append('<ul class="gallery">'+new_images+'</ul>');

- h2ooooooo

Answer 3

您是指这个吗？

$.each(images, function(key, value) { 
    new_images+= '<li><a href="'+value+'"><img src="'+value+'" alt="'+[key]+'" /></a></li>';
});
function myMethod(){
    $('#Gallery').remove();
    $('body').append('<ul class="gallery">'+new_images+'</ul>');
};
myMethod();

- Arsen Mkrtchyan

Answer 4

我现在有一个针对 .each-callback 的解决方案！

我必须为数组中的每个元素执行 ajax 请求。因此，我创建了一个包含所有 div 元素的 div 容器，用于每个元素。每次进行加载时，div 元素会变成绿色并 .slideUp，然后 .remove。 每次我都会询问 div 容器是否为空。如果是，则我知道所有元素都已完全加载（因为已删除）。

这是我的代码的一部分：

<script>
$(document).ready( function() {
    $.each(myChannels, function(index, value) {
        $("#tag_"+value).load('getxmls/ajaxrenewchannel/channel:'+value, function() {
            $("#tag_"+value).removeClass('alert-info').addClass('alert-success');
            $("#tag_"+value).slideUp('600', function () {
                $("#tag_"+value).remove();
                if( $('#loadcontainer').is(':empty') ) {
                    window.location = 'feeds/';
                }

                });

        });
    });
});
</script>

希望这能帮助到某个人...

- FishWave

Answer 5

我不确定你所指的回调函数。我猜这就是你要找的

$('#Gallery').remove();
var selectItems='<ul class="gallery">';
$.each(images, function(key, value) { 
    selectItems+= '<li><a href="'+value+'">
                              <img src="'+value+'" alt="'+[key]+'" /></a></li>';    
});   
selectItems+= '</ul>';
$('body').append(selectItems);

- Shyju