问题:为什么 setTimeout 函数中的 $(this) 指向 window 对象以及如何获取在 setTimeout 中单击的当前 div 的访问权限？
<head>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
</head>
<body>
<div class="outer">
<div class="inner">
</div>
</div>
</body>
JS:
$("div.inner").on('click',function(e){
//code block start
var parentOffset = $(this).parent().offset();
var relX = e.pageX - parentOffset.left;
var relY = e.pageY - parentOffset.top;
console.log(relX);
console.log(relY);
//code block end
setTimeout(function(){
//inserting code block here to see my problem
},200);
});
最佳答案
您希望在进入 setTimeout 之前将当前元素 this 和 e 缓存在全局变量中，如下所示。
请记住，setTimeout 和 setInterval 在全局范围内运行；因此它们只能访问全局变量和函数...将它们视为 window.setTimeout() 和 window.setInterval():
$("div.inner").on('click',function(e){
window.that = $(this);
window.e = e;
setTimeout(function(){
//code block start
var parentOffset = that.parent().offset();
var relX = e.pageX - parentOffset.left;
var relY = e.pageY - parentOffset.top;
console.log(relX);
console.log(relY);
//code block end
},200);
});
更新
也可以按照 @Dom 在下面的评论中建议的那样使用闭包。 闭包不需要全局变量(因此这是一种更好的方法，因为我们尽力不让全局范围变得困惑)，但我们必须传递给我们想要在 setTimeout 中使用的闭包值:
$("div.inner").on('click',function(e){
(function( that, e ) { //<<---- corresponding variables used within closure
setTimeout(function(){
//code block start
var parentOffset = that.parent().offset();
var relX = e.pageX - parentOffset.left;
var relY = e.pageY - parentOffset.top;
console.log(relX);
console.log(relY);
//code block end
},200);
})( $(this), e ); //<<---- values passed to closure from click handler
});
关于jquery - $(this) 在函数内部使用时指向窗口对象，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26153373/