mootools_具有MooTools的Element.Event.Pseudo的超强伪装

mootools

The MooTools Team and its contributors are always looking for more efficient, creative ways to accomplish common tasks.  Not only is accomplishing the task with an efficient amount of code good enough, but doing so while keeping the code legible and functionality reliable.  I'm confident that we've found such a blend of functionality and code efficiency with MooTools More's Element.Event.Pseudo.  Element.Event.Pseudo meshes event assignment and functionality to provide a quick way to trigger functionality from special pseudo-style events.

MooTools团队及其贡献者一直在寻找更有效，更有创意的方式来完成常见任务。 使用有效数量的代码来完成任务不仅足够好，而且在使代码清晰易读且功能可靠的同时做到这一点。 我相信我们已经在MooTools More的Element.Event.Pseudo中发现了功能和代码效率的完美结合。 Element.Event.Pseudo网格化事件分配和功能，以提供一种从特殊的伪样式事件触发功能的快速方法。

MooTools Element.Event.Pseudos (MooTools Element.Event.Pseudos)

It all starts with a pseudo-style syntax within the addEvent method, much the way that MooTools' event delegation works:

所有这些都以addEvent方法中的伪样式语法开始，这与MooTools的事件委托的工作方式大致相同：

domElement.addEvent('eventType:pseudoName', function(){
    //triggered method
});

The first portion of the string is the event.  The second portion of the event string is the pseudo-functionality to execute when the event is triggered.  Lastly, the function provided executes when the pseudo is matched.

字符串的第一部分是事件。 事件字符串的第二部分是触发事件时要执行的伪功能。 最后，提供的功能在伪指令匹配时执行。

Element.Event.Pseudos：​​：一次伪事件 (Element.Event.Pseudos:  The :once Pseudo Event)

One of the special event pseudos that comes bundled with Element.Event.Pseudo is :once.  The :once pseudo event allows a functionality to occur once per element;  once the event has been triggered for a given element, it may not be triggered on that element again:

Element.Event.Pseudo附带的特殊事件伪代码之一是:once 。 :once伪事件允许每个元素发生一次功能。 一旦为给定元素触发了事件，则可能不会再次在该元素上触发该事件：

domElement.addEvent('click:once', function(){
    console.log('I was clicked for the very first time!');
});

The above element may be clicked once;  after the first click, the console statement will not run again.  The code that accomplishes this one-time-only task is as follows:

可以单击一次以上元素； 第一次单击后，console语句将不再运行。 完成此一次性任务的代码如下：

Event.definePseudo('once', function(split, fn, args){
    fn.apply(this, args);
    this.removeEvent(split.original, fn);
});

Element.Event.Pseudos：​​定义自定义伪事件 (Element.Event.Pseudos:  Defining Custom Pseudo Events)

You can create your own pseudo events with Event.definePseudo.  This method's signature and arguments are as follows:

您可以使用Event.definePseudo创建自己的伪事件。 该方法的签名和参数如下：

Event.definePseudo(name, fn(splitObj,fn,args) {
	
});

The first argument is the pseudo name, the second is a function with three arguments:

第一个参数是伪名称，第二个参数是具有三个参数的函数：

• An object with the following properties:

  具有以下属性的对象：

  • event: the type of event to listen to
    event：要监听的事件类型
  • value: the value within the option "()" piece of the pseudo
    值：伪选项“()”中的值
  • pseudo: the name of the pseudo
    伪：伪的名称
• The function to be run
  要运行的功能
• Arguments to be provided to second argument
  提供给第二个参数的参数

The structure is quite simple and lends itself well to legible code.

结构非常简单，非常适合清晰的代码。

Element.Event.Pseudos.Keys (Element.Event.Pseudos.Keys)

As if basic pseudo events were enough, Element.Event.Pseudo.Keys allows you to couple keys with your event:

好像基本的伪事件就足够了，Element.Event.Pseudo.Keys允许您将键与事件耦合：

domElement.addEvent('keydown:keys(alt+1+a)',function(){
    console.log('Keys pressed: alt, 1 and a');
});

The following keys are supported:  enter, up, down, left, right, esc, space, backspace, tab, delete, shift, control, alt, capslock, pageup, pagedown, end, home, numlock, scrolllock, ;, =, ,, -, ., /, `, [, \, ], ', +.  Obviously basic letters and numbers are also supported.

下面的键被支持： 进入 ， 上 ， 下 ， 左 ， 右 ，ESC， 空间 ， 退格键 ， 选项卡 ， 删除 ， 转移 ， 控制 ，ALT， 大写锁 ， 上一页 ， 下一页末 ， 最后 ， 家里 ，NumLock键 ，ScrollLock键 ; ，=，，， - ，。 ， / ， ` ， [ ， \ ， ] ， ' ， + 。 显然也支持基本字母和数字。

超级伪造！ (Super-Powered Pseudos!)

Pretty cool, huh?  The code is compact but also still very readable and maintainable!  Let me know if you have any ideas for pseudo events or, even better, a few code snippets you'd like to share.  They make it into MooTools More!

太酷了吧？ 该代码虽然紧凑，但仍然非常易于阅读和维护！ 让我知道您是否对伪事件有任何想法，或者甚至更想分享一些代码片段。 他们使它成为MooTools更多！

翻译自: https://davidwalsh.name/mootools-pseudo

mootools