Question

我一直在尝试将$（this）缓存在一个名为$ this的变量中，用于我的JQuery代码以提高效率但是当我尝试在单击处理函数中引用$ this时它不起作用;但是，使用$（this）可以。这是我的代码，没有$（this）的缓存版本。

$(function() {
    var listNav = $('.row .listNav'),
        listItem = listNav.find('li'),
                    $this = $(this);

        listItem.click(function() {

            listItem.removeClass('selected');
            $this.addClass('selected');
        });
});

如果我尝试在顶部的变量列表中创建变量，然后在四个单击函数中引用它，则它不起作用。

Answer 1

$（this）在调用时从上下文创建一个jQuery对象。 this根据触发的单击处理程序进行更改，因此在代码顶部对其进行缓存将无法获得所需的结果。

如果您需要在处理程序中多次访问$(this)，请将其缓存在处理程序中。

$this = $(this);  // won't work because 'this' is different in the handler.

    bullet.click(function() {
        var $this = $(this);    // Will work as it's defined in the right context
        var bulletStr = $this.text(),
            bulletNum = parseInt(bulletStr),
            bulletMargin = slideWidth * bulletNum;

        bullet.removeClass('active');
        $this.addClass('active');
        current = bulletNum;
        if(current >= lastSlide) {
            nextBtn.hide();
        }
        else if(current < lastSlide) {
            nextBtn.show();
        }
        if(current > 0) {
            prevBtn.show();
        }
        else {
            prevBtn.hide();
        }
        sliderInner.animate({marginLeft: -bulletMargin}, 300, "easeInOutQuad");
        listItem.removeClass('selected');
        listItem.eq(bulletNum).addClass('selected');
    });

Answer 2

你是如何开始的？如果你做了像

这样的事情

$ this = $（this）;

它必须不起作用，因为列表this包含你的功能范围，但不是最终的clicks范围

你做的事情

var that; // - without initing it

然后再做

but.click = function(){
    that = $(this);
}

Answer 3

尝试使用

listItem.click(function(data)

而不是

listItem.click(function()

$（this）的缓存版本不起作用

3 个答案: