mootools_使用MooTools期刊-白红宇

mootools

If I were to explain MooTools in a sentence I'd say "MooTools makes common JavaScript tasks exponentially easier and the code more elegant." Dealing with intervals in JavaScript is fairly simple but not so elegant. Here's MooTools's take on setInterval.

如果我要用一句话来解释MooTools，我会说：“ MooTools使普通JavaScript任务成倍地变得容易，并且代码更加优雅。” 用JavaScript处理间隔是相当简单的，但并不那么优雅。这是MooTools对setInterval的看法。

基本功能。定期用法 (Basic Function.periodical Usage)

/* the function to repeatedly run */var fnToRepeat = function() {	console.log('Running periodical!');};/* set periodical into action!  once every second */var periodicalID = fnToRepeat.periodical(1000);

The above function will run periodically every second. This method takes the place of JavaScript's native setInterval -- periodical Moo-izes setInterval. You'll also notice that this method returns the interval ID.

上述功能将每秒定期运行。此方法代替JavaScript的本机setInterval-定期Moo-izes setInterval。您还将注意到，此方法返回时间间隔ID。

用$ clear清除期刊 (Clearing Periodicals with $clear)

/* the function to repeatedly run */var count = 0;var fnToRepeat = function() {	count++;	console.log('Periodical run ' + count + ' times');	if(count == 10) {		$clear(periodicalID);	}};/* do only 10 times, once every second */var periodicalID = fnToRepeat.periodical(1000);

When you no longer want the periodical to run, you simply use MooTools' global $clear method. That's it -- the periodical stops for good. You may initialize another periodical with the same function however a new interval ID will be returned.

当您不再希望运行期刊时，只需使用MooTools的全局$ clear方法。就是这样-期刊永远停下来。您可以使用相同的功能初始化另一个期刊，但是将返回一个新的间隔ID。

现实生活中的例子 (Real-Life Example)

I was required to write a slideshow of sorts for a client which would periodically swap slides. The periodical was meant to continue "forever" but stop when the mouse hovered other the displaying slide, then start again when the mouse left. Here's how I did it:

我被要求为客户编写各种幻灯片，这些幻灯片会定期交换幻灯片。该期刊本应“永远”继续，但是当鼠标悬停在其他正在显示的幻灯片上时停止，然后在鼠标离开时再次开始。这是我的做法：

/* setup */var periodicalID;var begin = function() {	periodicalID = (function() {		//do all the rotation stuff here	}).periodical(5000);}/* start it! */begin();/* events ("start" / "stop") */$('slider-container').addEvents({	mouseenter: function() {		//temporarily stop		$clear(periodicalID);	},	mouseleave: begin});

Note that I didn't "pause" the periodical per say -- I simply stopped the periodical and started a new interval when the mouse left the slide area.

请注意，我并没有说“暂停”期刊-我只是停止了期刊，并在鼠标离开幻灯片区域时开始了新的间隔。

Periodicals are an essential functionality in JavaScript that MooTools has more elegantly presented. MooTools FTW!

期刊是MooTools更优雅地介绍JavaScript中的一项基本功能。 MooTools FTW！

翻译自:

mootools