如何解决调用自定义函数切换DOM类时的this上下文传递问题

你说的完全正确，问题核心就是this的上下文没传对！当你直接调用swclass('itemoveact')时，swclass函数内部的this指向的是全局对象（浏览器里就是window），根本不是你点击的那个.itemove元素，所以代码自然没效果。下面给你两种简单的修复方案：

方案一：用call绑定this指向 #

在调用swclass的时候，用call方法把当前点击事件里的this（也就是被点击的元素）传递进去，这样函数内部的this就会指向正确的元素：

$(document).on('click', '.itemove', function() {
  swclass.call(this, 'itemoveact');
});

function swclass(c){
  $('.' + c).removeClass(c);
  $(this).addClass(c);
}

方案二：直接传递元素作为参数 #

如果你不想依赖this的上下文，也可以把被点击的元素直接作为参数传给swclass，函数里直接操作这个参数就行，更直观：

$(document).on('click', '.itemove', function() {
  swclass('itemoveact', this);
});

function swclass(c, element){
  $('.' + c).removeClass(c);
  $(element).addClass(c);
}

两种方法都能实现你想要的效果，选哪种看你个人习惯啦～

内容的提问来源于stack exchange，提问作者user7461846