![](/img/trans.png)
[英]Reference calling DOM element in jQuery.ajax() with dataType 'script'
[英]How do I reference the calling dom element in a jquery ajax success function?
如果基于该元素的ajax调用成功,我正在尝试修改该元素的类
<script type='text/javascript'>
$("#a.toggle").click(function(e){
$.ajax({
url: '/changeItem.php',
dataType: 'json',
type: 'POST',
success: function(data,text){
if(data.error=='')
{
if($(this).hasClass('class1'))
{
$(this).removeClass('class1');
$(this).addClass('class2');
}
else if($(this).hasClass('class2'))
{
$(this).removeClass('class2');
$(this).addClass('class1');
}
}
else(alert(data.error));
}
});
return false;
});
</script>
<a class="toggle class1" title='toggle-this'>Item</a>
我对问题的理解是,在成功函数中, 它引用ajax对象参数,而不是像在click函数的其他位置那样调用dom元素。 那么,如何引用调用dom元素并检查/添加/删除类?
您可以将其存储在变量中。 例:
$("#a.toggle").click(function(e)
{
var target = $(this);
$.ajax({
url: '/changeItem.php',
dataType: 'json',
type: 'POST',
success: function(data,text)
{
if(data.error=='')
{
if(target.hasClass('class1'))
{
target
.removeClass('class1')
.addClass('class2');
}
else if(target.hasClass('class2'))
{
target
.removeClass('class2')
.addClass('class1');
}
}
else(alert(data.error));
}
});
return false;
});
jQuery将事件的目标以及与此事件有关的其他信息传递给您的处理函数。 有关更多信息,请参见http://docs.jquery.com/Events_%28Guide%29 。
在您的代码中,它的引用方式类似于$(e.target)。
最好设置ajax参数: context: this
。 例:
$.ajax({
url: '/changeItem.php',
dataType: 'json',
type: 'POST',
context: this,
success: function(data,text){
if(data.error=='')
{
if($(this).hasClass('class1'))
{
$(this).removeClass('class1');
$(this).addClass('class2');
}
else if($(this).hasClass('class2'))
{
$(this).removeClass('class2');
$(this).addClass('class1');
}
}
else(alert(data.error));
}
});
我知道它已经很旧了,但是您可以使用click函数中的'e'参数。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.