jquery 绑定事件 _this
jQuery 事件绑定中的 _this 使用
在 jQuery 中,_this 通常用于在事件处理函数中保留对当前 DOM 元素的引用,尤其是在嵌套函数或异步回调中需要访问原始上下文时。
常见场景与解决方案
保存当前元素的引用
在事件处理函数内部,this 通常指向触发事件的 DOM 元素。若需要在嵌套函数中访问该元素,可通过 _this 临时保存:

$('.btn').click(function() {
var _this = this; // 保存当前 DOM 元素
setTimeout(function() {
$(_this).css('color', 'red'); // 在回调中使用
}, 1000);
});
箭头函数替代方案
ES6 的箭头函数自动绑定外层 this,可避免手动保存 _this:

$('.btn').click(function() {
setTimeout(() => {
$(this).css('color', 'red'); // 直接使用外层 this
}, 1000);
});
jQuery 的 event.currentTarget
通过事件对象的 currentTarget 属性也可获取触发事件的元素:
$('.btn').click(function(event) {
setTimeout(function() {
$(event.currentTarget).css('color', 'red');
}, 1000);
});
注意事项
- 使用
_this时需确保变量名不与作用域内其他变量冲突。 - 在严格模式下,全局作用域的
this为undefined,需明确绑定上下文。 - 箭头函数虽简化代码,但会改变
this的绑定规则,需根据场景选择。
通过以上方法,可以灵活处理 jQuery 事件中的上下文绑定问题。





