Javascript 将$this传递到函数中

我试图传递一个对用户选择的项目的引用（以便在其上运行适当的Javascript效果），但它似乎不起作用。最初是这样，但当我重构代码使其更易于阅读时，它停止了。我认为这是我使用的逻辑问题，有人能告诉我如何纠正它吗

新代码-不起作用但易于阅读

$('.timeline-item').click(function() {
    expandTimelineDetail( $(this));
});

function expandTimelineDetail($obj) {
     // UI effect
     $obj = $(this).css("background-color", "#F5F5F5");
     setTimeout(function () {
         $obj.css("background-color", "#FFFFFF");
     }, 250);

     // Make timeline item active
     $obj.addClass("active-item");
     $obj.next().addClass("active-item").css('display', 'block');

     // Hide the rest of the timeline items that are not active
     $('#timeline > :not(.active-item)').hide();
     $('#leftspan').css('visibility', 'visible');
     $('.search-container').css('display', 'none');

     // Hide relative departure time, show actual departure time
     $('.actual-time').css('display', 'inline');
     $('.leaving-time').css('display', 'none');
}

$('.timeline-item').click(function() {
        var $this = $(this).css("background-color","#F5F5F5");
        setTimeout(function() {
            $this.css("background-color","#FFFFFF");
        }, 250);
        $(this).addClass("active-item");
        $(this).next().addClass("active-item").css('display','block');
        $('#timeline > :not(.active-item)').hide();
        $('#leftspan').css('visibility','visible');
        $('.search-container').css('display','none');
        $('.actual-time').css('display','inline');
        $('.leaving-time').css('display','none');
});

旧代码-工作正常但难以阅读

$('.timeline-item').click(function() {
    expandTimelineDetail( $(this));
});

function expandTimelineDetail($obj) {
     // UI effect
     $obj = $(this).css("background-color", "#F5F5F5");
     setTimeout(function () {
         $obj.css("background-color", "#FFFFFF");
     }, 250);

     // Make timeline item active
     $obj.addClass("active-item");
     $obj.next().addClass("active-item").css('display', 'block');

     // Hide the rest of the timeline items that are not active
     $('#timeline > :not(.active-item)').hide();
     $('#leftspan').css('visibility', 'visible');
     $('.search-container').css('display', 'none');

     // Hide relative departure time, show actual departure time
     $('.actual-time').css('display', 'inline');
     $('.leaving-time').css('display', 'none');
}

$('.timeline-item').click(function() {
        var $this = $(this).css("background-color","#F5F5F5");
        setTimeout(function() {
            $this.css("background-color","#FFFFFF");
        }, 250);
        $(this).addClass("active-item");
        $(this).next().addClass("active-item").css('display','block');
        $('#timeline > :not(.active-item)').hide();
        $('#leftspan').css('visibility','visible');
        $('.search-container').css('display','none');
        $('.actual-time').css('display','inline');
        $('.leaving-time').css('display','none');
});

您正在将

$（this）

传递给函数，在该函数中，您将另一个值赋给

$obj

参数

您可以将此绑定到函数：

expandTimelineDetail.bind(this);

在这里，您可以像以前一样访问此

---

或者只是不要重新分配

$obj

变量。

不要用“$obj=$（this）.css（“背景色”，“#f5”）；”覆盖$obj的值。另外，为什么不只是$（'.timeline item'）。单击（expandTimelineDetail）；？然后，当您传递$（this）时，可以使用$（this）而不是$obj$（this）=$obj.@bobdye-完整代码实际上是调用了许多其他函数。看看这里，只需去掉函数中的

$obj=$（this）

，

这个

没有上下文，实际上是

窗口