我编写了以下代码,希望只有在内容尚未加载到div中时才会加载ajax。基本上,当我使用ajax加载内容并根据当前加载的内容为内容提供类名。如果当前的类名是已经在div中加载的内容,那么我不加载ajax,否则用ajax加载内容。
现在无论div的类名是什么,ajax请求都会触发。知道为什么这不起作用吗?
这是网站:(点击左眼)
http://www.uvm.edu/~areid/homesite/index.html
这是javascript函数:
else if(id =='left-eye23')
{
leftcontent = $("#left-content");
content = leftcontent.attr('class');
if(content !== 'photos')
{
alert("content is not photos");
SlideOut(move);
$("#relativeContainer").css('z-index','-1');
var leftcontent;
$("#left").bind("webkitTransitionEnd mozTransitionEnd oTransitionEnd msTransitionEnd transitionend",
function(){
$.ajax({
url:'photos.php',
beforeSend: function(){
leftcontent.html('<img src="loading.gif" /> Now loding...');
},
}).done(function(data){
leftcontent.html(data);
leftcontent.addClass("photos");
});
});
}
else if(content == 'photos')
{
SlideOut(move);
$("#relativeContainer").css('z-index','-1');
alert('content is photos');
}
}
答案 0 :(得分:3)
使用jQuery验证类的最佳方法是通过.hasClass()
。如果元素有多个类,则它将无法正确匹配您正在使用的.attr()
测试。
// If it doesn't have the class 'photos', do your AJAX call
if( !$("#left-content").hasClass('photos'))
{
alert("content is not photos");
SlideOut(move);
$("#relativeContainer").css('z-index','-1');
// Then do the AJAX, etc...
}
// Otherwise do the other stuff...
// Unless you have another case not shown in your code above,
// this can just be a plain else {} rather than the else if {}
else if ($("#left-content").hasClass('photos'))
{
SlideOut(move);
$("#relativeContainer").css('z-index','-1');
alert('content is photos');
}