[英]$(this) not working inside the success function of ajax
I am using ASP.NET MVC with Jquery, and this seems to be a jquery fault. 我使用ASP.NET MVC和Jquery,这似乎是一个jquery错误。
I am making an ajax call to my method, my code is 我正在对我的方法进行ajax调用,我的代码是
$('.reopenBtn').live('click', function () {
var taskId = $(this).attr("data-taskid");
$.ajax({
url: '/Task/ReopenTask/?strTaskId=' + taskId,
type: "POST",
success: function (data) {
// this does not work !!
$(this).parent().parent().closest("div").remove();
},
error: function (xhr, ajaxOptions, thrownError) {
alert('Error');
}
});
});
The remove
doesn't work however when creating a jsfiddle for this question here , this works. remove
不起作用,但是在这里为这个问题创建一个jsfiddle,这是有效的。
So, is $(this)
something different inside the success function of the ajax call ? 那么,在ajax调用的成功函数中, $(this)
是不同的东西吗?
How do I get around this ? 我该如何解决这个问题? Thanks 谢谢
context
property will work inside the success function of ajax context: this,
context
属性将在ajax context: this,
的success函数内部工作context: this,
$('.reopenBtn').live('click', function () {
var taskId = $(this).attr("data-taskid");
var self = this;
$.ajax({
url: '/Task/ReopenTask/?strTaskId=' + taskId,
type: "POST",
success: function (data) {
$(self).parent().parent().closest("div").remove();
},
error: function (xhr, ajaxOptions, thrownError) {
alert('Error');
}
});
});
Or you could set context
property of ajax option. 或者您可以设置ajax选项的context
属性。
$('.reopenBtn').live('click', function () {
var taskId = $(this).attr("data-taskid");
$.ajax({
url: '/Task/ReopenTask/?strTaskId=' + taskId,
type: "POST",
context: this,
success: function (data) {
$(this).parent().parent().closest("div").remove();
},
error: function (xhr, ajaxOptions, thrownError) {
alert('Error');
}
});
});
I prefer this method, wrapping with $.proxy, two args are callback function and this
as 2nd argument. 我更喜欢这个方法,用$ .proxy包装,两个args是回调函数, this
是第二个参数。
$.post('/foo', data, $.proxy(function(d){
// do stuff with data
}, this));
I think it is shortest and cleanest. 我认为它是最短,最干净的。
You can do what others say above as well, either copying this
to that
( self
is a reserved word) and then using in callback, or using $.ajax with context: this
parameter. 你可以做上面说什么别人为好,无论是复制this
到that
( self
是一个保留字),然后利用回调,或使用$就与context: this
参数。
The context of the click
method is simply not the same as for the success
method. click
方法的上下文与success
方法的上下文不同。 Thus you do not have the same this
in the inner function. 因此,你在内部函数中没有this
。 You can avoid that by using a local variable like $this
or clickedButton
and use it in your success
method: 您可以通过使用像$this
或clickedButton
这样的局部变量来避免这种情况,并在success
方法中使用它:
$('.reopenBtn').live('click', function () {
var $this = $(this)
var taskId = $this.attr("data-taskid");
$.ajax({
url: '/Task/ReopenTask/?strTaskId=' + taskId,
type: "POST",
success: function (data) {
// $this is taken from the outer function context
$this.parent().parent().closest("div").remove();
},
error: function (xhr, ajaxOptions, thrownError) {
alert('Error');
}
});
});
For detailed explanation you might want to take a look at Closures in JavaScript 有关详细说明,您可能需要查看JavaScript中的Closures
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.