关于prototype.js的一些技术说明

<script src="prototype1.3.1.js"></script>
<input type=checkbox id=myChk name="chk" value=1> Test
<script>
Event.observe(myChk, 'click', showMessage, false);
//$('myChk').onclick=showMessage;
//$('myChk').onclick=showMessage.bind();
$('myChk').onclick=showMessage.bind($('myChk'));
function showMessage() {
　　 alert(this.value);
}
</script>

执行上面代码，你就能明白Event.observe与bind/bindAsEventListener之间的区别：

（１） 显然Event.observe有限制，只能处理简单的函数，并函数中不能有this之类的东西。

（２）Event.observe内部用到addEventListener／attachEvent。能把多个函数加到一个触发事件（window.onload）。bind是覆盖。

关于函数的绑定

类库提供了Function.prototype.bind　Function.prototype.bindAsEventListener两个方法。首先我们从概念上解释一个这两个方法。

任何一个函数都可以调用这两个方法；参数的是javascript对象或网页上元素对象；返回类型是个函数对象。

本来我就是个函数，返回还是函数，到这两个函数有什么不同呢。看实现代码，关键还是applycall函数的代码。其实这里只是转化了一下方法调用的对象。

<script src="prototype1.3.1.js"></script>
<input type=checkbox id=myChk name="asf" value=1> Test
<script>
　　var CheckboxWatcher = Class.create();
　　CheckboxWatcher.prototype = {
　　 　initialize: function(chkBox, message) {
　　 　 　 this.chkBox = $(chkBox);
　　 　 　 this.message = message;
　　 　 　 this.chkBox.onclick = this.showMessage.bindAsEventListener(this);
　　 　},
　　 　showMessage: function(evt) {
　　 　 　alert(this.message + ' (' + evt.type + ')');
　　 　}
　　};
new CheckboxWatcher('myChk','message!!!!');
//$('myChk').onclick=function(){};
</script>