[英]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.