2012-05-02 117 views
0

我有这样的JS代码:如何从嵌套函数和匿名函数中返回值?

function paging() { 
    $('.paging li').click(function(e) { 
     $('.paging li a').removeClass("active"); 
     $(this).find('a').addClass("active"); 
     $('#img-grp-wrap img').hide(); 

     var indexer = $(this).index(); 
     $('#img-grp-wrap img:eq('+indexer+')').fadeIn();  

     e.preventDefault(); 
     return indexer; 
    }); 
} 

var $cur_page = paging(); 
console.log($cur_page); 

我想使用的功能分页(),但是当我尝试做的console.log(),它只是说不确定外的索引值。

我该如何构造这个,以便我可以传递我在功能外(这是索引变量)单击的链接的索引值?

我是一个编程新手,所以请忍受我。

回答

3

这听起来像你真的不明白事件处理程序是如何工作的。当你安装一个点击处理程序时,你告诉系统你希望它在未来某个时候发生点击时调用这个函数。你的函数paging()运行并完成很长时间,只要你的元素被点击并且你的匿名函数被调用。因此,paging()函数无法返回点击处理程序的结果,因为点击甚至还没有发生。

如果您有一些代码想要使用indexer值,那么您需要从点击处理程序调用该代码,并将indexer的值作为参数传递给您要调用的函数。这可能是这个样子:

$('.paging li').click(function(e) { 
    $('.paging li a').removeClass("active"); 
    $(this).find('a').addClass("active"); 
    $('#img-grp-wrap img').hide(); 

    var indexer = $(this).index(); 
    $('#img-grp-wrap img:eq('+indexer+')').fadeIn();  

    e.preventDefault(); 
    // call a function and pass it the indexer value 
    processIndex(indexer); 
}); 

通知,我还删除了分页功能,因为你不希望调用一个以上的时间,因为它会重新安装你的事件处理程序做的。

+0

好吧,我会尝试。就像我在底部所说的,我是程序员新手,调用事件处理程序的函数和概念在我脑海中仍然有些模糊(尽管我理解它们的一些小部分)。不管怎么说,还是要谢谢你。 – catandmouse

+0

(大声笑,如果我知道事情应该如何工作,很有趣,我不会问这个问题。) – catandmouse

+0

@catandmouse - 你为什么在3-1/2年后回应我?刚才什么促使回应?我很好奇为什么最新的评论? – jfriend00

1

正如@ jfriend00所说,由于工作方式的原因,您无法按照自己的想法访问事件处理函数的返回值。

但是,您当然可以让他们在外部(例如全局)范围内设置一个变量,然后让他们触发事件发生后需要运行的任何操作。或者,您可以将一个值作为参数传递给另一个函数。

E.g.

// Declare external variable outside event handler. 
var pagingOutput; 

function paging() { 
    $('.paging li').click(function(e) { 
     // Handle event... 

     pagingOutput = someValue; 
     actionToPerfomAfterPaging(); 

     // Of course, you could also do something like this... 
     actionToPerformAfterPaging_2(someValue); 

    }); 
} 

function actionToPerfomAfterPaging() { 
    doSomethingWithPagingOutput(pagingOutput); 
} 

function actionToPerfomAfterPaging_2(val) { 
    doSomethingWithPagingOutput(val); 
} 

var $cur_page = paging(); 
console.log($cur_page); 

您无法从事件处理程序返回值的原因是该脚本运行在负责处理页面上其他所有内容的同一线程上。如果您在理论上为事件处理程序设计一种返回值的方式,则必须阻止该线程,直到事件触发为止。这意味着该页面将冻结,直到发生与处理程序相关的任何事件,例如,用户点击一个按钮。