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);

我想在函数 paging() 之外使用索引器值,但是当我尝试执行 console.log() 时,它只是说undefined

如何构造它,以便我可以传递我在函数外部单击的链接的索引值(这是索引器变量)?

我是一个编程新手,所以请多多包涵。

4

2 回答 2

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);
});

请注意,我还删除了分页功能,因为您不想多次调用它,因为它会再次安装您的事件处理程序。

于 2012-05-02T03:52:47.307 回答
1

正如@jfriend00 所说,由于事件处理程序的工作方式,您无法以您的想法访问事件处理程序的返回值。

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

例如

// 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);

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

于 2012-05-02T04:04:33.573 回答