javascript - $(this) 不适用于 DragDealerjs

Question

我正在使用 DragdealerJS 触发多个操作，并且需要最后一个左侧操作(当 x 小于 0.00001 时)将单个 div 设为蓝色。我知道这是某种具有约束力的问题，但在过去的几个小时里我一直无法解决该问题。有谁知道如何解决这个问题？感谢您的帮助。

$(function() {
    new Dragdealer('demo-simple-slider', {
        x: 0.5,
        animationCallback: function(x, y) {
            if (x < 0.00001) {
                $(this).css('background-color', 'blue');
            } else if (x < 0.3) {
                $(".dragdealer").css('background-color', '#00cf48');
                $(".dragdealer").addClass('dragEdit');
            } else if (x > 0.99999) {
                $('.dragdealer').css('background-color', 'red');
                $('.dragdealer').parent().slideUp("slow");
            } else if (x > 0.7) {
                $('.dragdealer').css('background-color', 'red');
                $('.dragdealer').addClass('dragTrash');

            } else {
                $('.dragdealer').css('background-color', 'white');
                $('.dragdealer').removeClass('dragTrash');
                $('.dragdealer').removeClass('dragEdit');
            }
        }
     });
});

如果有帮助的话，这是 HTML。

<div id="demo-simple-slider" class="dragdealer">
    Scene
    <div class="handle red-bar"></div>
</div>

Answer 1

问题的原因就是因为这个。在 animationCallback 函数中，this 引用 DragDealer 实例，但在您的情况下，您想要访问 DragDealer 元素 。

要访问它，您可以使用 this.handle 属性。