在jQuery中,on方法可以为元素绑定事件,trigger方法可以手动触发事件,围绕这2个方法,我们来体验jQuery中的观察者模式(Observer Pattern)。
■ on方法绑定内置事件,自然触发
比如,我们给页面的body元素绑定一个click事件,这样写。
代码如下:
以上,我们只有点击body,才能触发click事件。也就是说,当给页面元素绑定内置事件后,事件的触发是在内置事件发生的那刻。
■ on方法绑定内置事件,手动触发
使用trigger方法,也可以手动触发元素绑定的内置事件。
以上,无需点击body,在页面加载完毕,body自动触发了click事件。
■ on方法绑定自定义事件,手动触发
我们知道,click是jquery内置的事件,那么,是否可以自定义事件,并手动触发呢?
代码如下:
以上,on方法就像一个订阅者,它订阅了自定义事件app.myevent;而trigger方法就像一个发布者,它发布事件和参数后,才真正让订阅者方法得以执行。
■ jQuery观察者模式的扩展方法
为此,我们还可以为jQuery观察者模式专门写一个扩展方法。
代码如下:
以上,定义了全局的publish和subscribe方法,我们在任何时候都可以调用。
代码如下: