Jquery animate方法在concat之后无法识别属性

我创建了一个

animate（）

方法，该方法从单击元素的

data-

属性获取动画的推送方向和时间：

HTML

计时工作正常，但即使

stringEmpuje

var正确地警告最终字符串，方向也不适用，jQuery应该将其识别为CSS属性，但它不适用

---

看起来您正试图将

stringEmpuje

的值作为键传递给

动画

方法。如果是，请尝试以下方法：

$('.caja').on('click', function(){

    var empuje = $(this).data('empuje');
    var tiempo = $(this).data('tiempo');

    var stringEmpuje = "margin-" + empuje;
    var animOptions = {
        opacity: 0
    };
    animOptions[stringEmpuje] = '-=40px';

    $(this).animate(animOptions, tiempo);
});

使用ES2015，您只需执行以下操作：

$('.caja').on('click', function(){

    var empuje = $(this).data('empuje');
    var tiempo = $(this).data('tiempo');

    var stringEmpuje = "margin-" + empuje;

    $(this).animate({
        [stringEmpuje]: '-=40px',
        opacity: 0
    }, tiempo);
});

$('.caja').on('click', function(){

    var empuje = $(this).data('empuje');
    var tiempo = $(this).data('tiempo');

    var stringEmpuje = "margin-" + empuje;
    var animOptions = {
        opacity: 0
    };
    animOptions[stringEmpuje] = '-=40px';

    $(this).animate(animOptions, tiempo);
});

$('.caja').on('click', function(){

    var empuje = $(this).data('empuje');
    var tiempo = $(this).data('tiempo');

    var stringEmpuje = "margin-" + empuje;

    $(this).animate({
        [stringEmpuje]: '-=40px',
        opacity: 0
    }, tiempo);
});