由于IE无法淡化透明的PNG,我决定改变我的功能,如果用户正在使用IE,则只显示PNG,但如果他们使用任何其他浏览器则淡化它们。下面的函数在IE中工作正常并且按照我的预期进行,但在任何其他浏览器中,即Firefox,Safari它什么都不做,我错过了什么或者我有语法错误吗?
$('#content2 a').click(function(){
if($.browser.msie){
var toLoad = $(this).attr('href')+' #content';
$('#content').show(loadContent);
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
function loadContent() {
$('#content').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#content').show();
}
return false;
}else{
var toLoad = $(this).attr('href')+' #content';
$('#content').fadeOut('slow',loadContent);
$('#load').remove();
$('#wrapper').append('<span id="load">LOADING...</span>');
$('#load').fadeIn('slow');
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
function loadContent() {
$('#content').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#content').fadeIn('slow',hideLoader());
}
function hideLoader() {
$('#load').fadeOut('slow');
}
return false;
};
});
答案 0 :(得分:3)
你的大多数回调都是这样写的:
$('#content').load(toLoad,'',showNewContent())
对调用 showNewContent说,并将其返回值传递给jQuery。
你的意思是:
$('#content').load(toLoad, '', showNewContent);
但你也有潜在的问题:
}else{
...
$('#content').fadeOut('slow',loadContent);
...
function loadContent() {
将function
语句放在else
或任何其他块中而不是其他函数中实际上并不合法。这是因为允许您在上面的代码中使用函数的function
语句的魔力只有在函数开始运行之前修复了函数定义时才能工作。如果定义在条件块内,则不会发生这种情况。
由于JavaScript常见的流行,而不是告诉你错误,浏览器会让你逃脱它,但结果不一致和奇怪。这是一个明显矛盾的测试案例:
x();
var isgood= Math.random()*2>=1;
if (isgood) {
function x() {
alert('Good!');
}
} else {
function x() {
alert('Bad!');
}
}
此示例代码尝试在该事件实际发生之前调用依赖于抛硬币结果的函数。它应该是一个语法错误,但每个浏览器都允许它。 Mozilla至少留下x
持有undefined
,直到达到函数语句,因此初始x()
将导致错误。然而,在IE,Webkit和Opera中,第二个function
语句“胜出”,它总是警告“坏!”。糟糕的浏览器!
在需要定义更改的函数时,通过使用内联函数表达式而不是函数语句来避免此问题。虽然在这种情况下,你可以通过使用speed
0来使IE立即进行回调来解决衰落问题,这使得整个事情变得更加简单:
$('#content2 a').click(function() {
var speed= $.browser.msie? 0 : 'slow';
$('#content').fadeOut(speed, function() {
$('#content').load($(this).attr('href')+' #content', '', function() {
$('#content').fadeIn(speed);
});
});
});
答案 1 :(得分:1)
也许你应该添加';'在最后一行:
$('#content').load(toLoad,'',showNewContent());
在loadContent()
的两个定义中。