javascript - .css 函数在处理函数内部不起作用

Question

我想更改命名函数内部的 css 属性，而不是处理单击事件。如果我在单击事件中定义的匿名函数中调用 .css ，它就会起作用。但是，我想在处理函数内定义的命名函数内调用 .css 。这是我的代码。

$(document).ready(function () {
    $('#popup').click(partial(coolTransition, $(this)));
});

function coolTransition(elem) {
    shrink();

    function shrink() {
        elem.css('background-color', '#000000');
    }
}

//used to implement partial function application so that I can pass a handler reference that takes arguments. 
//see http://stackoverflow.com/questions/321113/how-can-i-pre-set-arguments-in-javascript-function-call-partial-function-applic
function partial(func /*, 0..n args */ ) {
    var args = Array.prototype.slice.call(arguments, 1);
    return function () {
        var allArguments = args.concat(Array.prototype.slice.call(arguments));
        return func.apply(this, allArguments);
    };
}

预先感谢您的帮助。

Answer 1

在:

$(document).ready(function() {
    $('#popup').click(partial(coolTransition, $(this)));
});

$(this) 是 $(document)。您需要 $(this) 来获取 $('#popup') 的上下文，为此您需要一个函数:

$(document).ready(function() {
    $('#popup').click((function() {
       return partial(coolTransition, $(this));
    })());
});

或者，您可以完全避免 $(this):

$(document).ready(function () {
    var $elm = $('#popup');
    $elm.click(partial(coolTransition, $elm));
});

实际上，partial 的整个用法似乎过于复杂。你为什么认为你需要它？最简单的方法是:

$(document).ready(function() {
    $('#popup').click(function() {
       coolTransition($(this));
    });
});