2012-03-22 46 views
4

嗨我还是很新的编程,我没有机会完全理解Java或Javascript我知道的唯一编程语言,但我很努力地理解Javascript。关于哪些函数被调用的Javascript命令

我面对的是有些时候,我不明白当JavaScript调用我创建的函数,例如。我为jQuery创建了一个小插件:http://jsfiddle.net/a9gjK/1/

插件非常简单,图像使用绝对位置设置在彼此之上。然后,我把第一个图像,并设置Z指数为100,然后我拿下一个图像,并设置它的Z指数为50之后,我再次拍摄第一个图像,并将其淡化为0不透明度,然后我调用一个回调函数女巫将第一个图像的z-index设置为0,并将其淡化为1不透明度,并将下一图像的z-索引设置为100.

完成此孔过程后,首先将变量设置为下一个元素。这就是我的问题出现。如果我首先将变量设置为回调函数中的下一个img,则插件运行良好,一切正常,但如果在脚本在每个图像上运行一次并且必须从第一个图像再次启动后,在回调函数外执行此操作当它淡出时,我会看到背景。如果我在回调函数中将第一个图像设置为next,则不会发生这种情况。

任何人都可以解释为什么会发生这种情况,以及这个相关的主题是什么,所以我可以更好地阅读和理解发生了什么。

+0

您应该在您的小提琴中放置完全合格的URL,以便图像出现(http:// ...) – 2012-03-22 14:07:39

+0

我无法找到要上传图像的位置,因此我无法再重新检查并更正我的错误谢谢 – user1146440 2012-03-22 14:16:06

+0

是的,你不能上传 - 你必须在自己的服务器上指向你自己的副本。 :( – 2012-03-22 14:41:03

回答

4

您遇到由异步功能引起的行为。

jQuery动画函数,如fadeTo异步执行,这意味着函数可以在你调用它之后的任何时候完成。如果你打电话,以两个异步函数的代码

asynch1(); 
asynch2(); 

的行为可以改变,因为没有保证asynch1asynch2之前执行。

这是回调的用途。您可以传递一个将在异步函数完成后运行的函数。

当你做到这一点,

$first.css({ 
    'z-index': 0 
}).fadeTo(50, 1); 
$next.css({ 
    'z-index': 100 
}); 
$first = $next; 

没有办法预测会首先发生什么。

如果你使用的回调,而不是

$first.css({ 
    'z-index': 0 
}).fadeTo(50, 1, function() { 
    $next.css({ 
    'z-index': 100 
    }); 
    $first = $next; 
}); 

你知道该$next CSS将设置后的淡出动画完成。