<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
<channel>
<title><![CDATA[LinZi's Blog]]></title>
<link>http://onewww.net/blog/</link>
<description><![CDATA[]]></description>
<language>zh-cn</language>
<copyright><![CDATA[Copyright 2005 PBlog3 v2.8]]></copyright>
<webMaster><![CDATA[LlinZzi(at)gmail(dot)com(LlinZzi)]]></webMaster>
<generator>PBlog2 v2.4</generator> 
<image>
	<title>LinZi&#39;s Blog</title>
	<url>http://onewww.net/blog/images/logos.gif</url>
	<link>http://onewww.net/blog/</link>
	<description>LinZi&#39;s Blog</description>
</image>

			<item>
			<link>http://onewww.net/blog/article.asp?id=126</link>
			<title><![CDATA[JavaScript面向对象编程[三] 自定义事件]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[JS Ajax]]></category>
			<pubDate>Fri,28 Nov 2008 10:27:43 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=126</guid>
		<description><![CDATA[继 &lt; JavaScript面向对象编程[二] 事件处理&gt;(<a href="http://onewww.net/blog/article.asp?id=124" target="_blank" rel="external">http://onewww.net/blog/article.asp?id=124</a>)<br/><br/>上一篇给foo类增加了<br/>addEvent和removeEvent方便事件的注册与注销<br/><br/>这次总结下自定义事件的几种方法<br/><br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/><br/>&#160;&#160;&#160;&#160;&lt;script type=&#34;text/javascript&#34;&gt;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&lt;!--<br/><br/>&#160;&#160;&#160;&#160;var foo = function(){ this.init.apply(this,arguments);};<br/><br/>&#160;&#160;&#160;&#160;foo.prototype = {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;init:function(_name){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.name = _name;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.addEvent(&#39;click&#39;,document,this.say,this,&#39;hello world!&#39;);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;say:function(_ev,_word){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;alert(this.name +&#39;:&#39; +_word);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.stop();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.onSay(_word);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;stop:function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.removeEvent(&#39;click&#39;,document,this.say);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;addEvent:function(_event,_element,_fn,_scope,_args){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var args = Array.prototype.slice.call(arguments, 0);&nbsp;&nbsp;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;ev = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;scope = args.length&gt;0?args.shift():window;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element[&#39;e&#39;+ev+fn] =&nbsp;&nbsp;function(_ev){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_ev == _ev || window.event;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;args.unshift(_ev);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn.apply(scope,args);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;};<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (element.addEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element.addEventListener(ev, element[&#39;e&#39;+ev+fn], false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (element.attachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element.attachEvent(&#34;on&#34; +ev, element[&#39;e&#39;+ev+fn]);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;removeEvent:function(_event,_element,_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (_element.removeEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.removeEventListener(_event, _element[&#39;e&#39;+_event+_fn], false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (_element.detachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.detachEvent(&#34;on&#34; +_event, _element[&#39;e&#39;+_event+_fn]);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;try {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;del&#101;te _element[&#39;e&#39;+_event+_fn];<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}catch(_ex){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element[&#39;e&#39;+_event+_fn] = null;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;onSay:function(){}<br/><br/>&#160;&#160;&#160;&#160;}<br/><br/><br/>var a = new foo(&#39;llinzzi&#39;);<br/>a.onSay = function(_word){<br/>&#160;&#160;&#160;&#160;alert(&#39;事件:&#39;+this.name +&#39;刚说了&#39;+ _word);<br/>}<br/><br/></div></div><br/><br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/html.gif" style="margin:0px 2px -3px 0px"> HTML代码</div><div class="UBBContent"><TEXTAREA rows="8" id="temp70739">
<html>
<head>
	<title>自定义事件</title>
	<meta http-equiv=&#34;Content-Type&#34; content=&#34;text/html; charset=utf-8&#34; >
	<meta name=&#34;keywords&#34; content=&#34;&#34; >
	<meta name=&#34;description&#34; content=&#34;&#34; >
</head>
<body>



	<script type=&#34;text/javascript&#34;>
		<!--

	var foo = function(){ this.init.apply(this,arguments);};

	foo.prototype = {
		init:function(_name){
			this.name = _name;
			this.addEvent('click',document,this.say,this,'hello world!');
		},
		say:function(_ev,_word){
			alert(this.name +':' +_word);
			this.stop();
			this.onSay(_word);
		},
		stop:function(){
			this.removeEvent('click',document,this.say);
		},
		addEvent:function(_event,_element,_fn,_scope,_args){
			var args = Array.prototype.slice.call(arguments, 0);  
			ev = args.shift(),
			element = args.shift(),
			fn = args.shift(),
			scope = args.length>0?args.shift():window;
			element['e'+ev+fn] =  function(_ev){
				_ev == _ev || window.event;
				args.unshift(_ev);
				fn.apply(scope,args);
			};
			if (element.addEventListener) {
				element.addEventListener(ev, element['e'+ev+fn], false);
			} else if (element.attachEvent) {
				element.attachEvent(&#34;on&#34; +ev, element['e'+ev+fn]);
			}
		},
		removeEvent:function(_event,_element,_fn){
			if (_element.removeEventListener) {
				_element.removeEventListener(_event, _element['e'+_event+_fn], false);
			} else if (_element.detachEvent) {
				_element.detachEvent(&#34;on&#34; +_event, _element['e'+_event+_fn]);
			}
			try {
				del&#101;te _element['e'+_event+_fn];
			}catch(_ex){
				_element['e'+_event+_fn] = null;
			}
		},
		onSay:function(){}

	}


var a = new foo('llinzzi');
a.onSay = function(_word){
	alert('事件:'+this.name +'刚说了'+ _word);
}

		// -->
	</script>
</body>
</html>
</TEXTAREA><br/><INPUT onclick="runEx('temp70739')"  type="button" class="userbutton" value="运行此代码"/> <INPUT onclick="doCopy('temp70739')"  type="button" class="userbutton" value="复制此代码"/> <INPUT onclick="saveCode('temp70739')" type="button" class="userbutton" value="保存此代码"><br/> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]</div></div><br/><br/>增加了个onSay的事件，在类定义的时候只定义成空函数，然后在需要的时候调用，定义具体的方法是在类实例化后，给实例中的onSay<br/><br/>缺点是只能定义一次的onSay的回调，如果多次定义后面的会把前面的覆盖掉，修改一下。<br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/><br/>&#160;&#160;&#160;&#160;var foo = function(){ this.init.apply(this,arguments);};<br/><br/>&#160;&#160;&#160;&#160;foo.prototype = {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;init:function(_name){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.name = _name;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.addEvent(&#39;click&#39;,document,this.say,this,&#39;hello world!&#39;);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;say:function(_ev,_word){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;alert(this.name +&#39;:&#39; +_word);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.stop();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this._onSay(_word);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;stop:function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.removeEvent(&#39;click&#39;,document,this.say);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;addEvent:function(_event,_element,_fn,_scope,_args){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var args = Array.prototype.slice.call(arguments, 0);&nbsp;&nbsp;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;ev = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;scope = args.length&gt;0?args.shift():window;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element[&#39;e&#39;+ev+fn] =&nbsp;&nbsp;function(_ev){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_ev == _ev || window.event;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;args.unshift(_ev);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn.apply(scope,args);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;};<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (element.addEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element.addEventListener(ev, element[&#39;e&#39;+ev+fn], false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (element.attachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element.attachEvent(&#34;on&#34; +ev, element[&#39;e&#39;+ev+fn]);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;removeEvent:function(_event,_element,_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (_element.removeEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.removeEventListener(_event, _element[&#39;e&#39;+_event+_fn], false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (_element.detachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.detachEvent(&#34;on&#34; +_event, _element[&#39;e&#39;+_event+_fn]);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;try {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;del&#101;te _element[&#39;e&#39;+_event+_fn];<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}catch(_ex){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element[&#39;e&#39;+_event+_fn] = null;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_onSay:function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(!this._onSayArray) return;&#160;&#160;&#160;&#160;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;for(var i=0; i&lt;this._onSayArray.length; i++){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this._onSayArray[i].apply(this,arguments);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;addOnSay:function(_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(!this._onSayArray) this._onSayArray = new Array();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this._onSayArray.push(_fn);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;}<br/><br/><br/>var a = new foo(&#39;llinzzi&#39;);<br/>a.addOnSay(function(_word){<br/>&#160;&#160;&#160;&#160;alert(&#39;事件1:&#39;+this.name +&#39;刚说了&#39;+ _word);<br/>});<br/>a.addOnSay(function(_word){<br/>&#160;&#160;&#160;&#160;alert(&#39;事件2:&#39;+this.name +&#39;刚说了&#39;+ _word);<br/>});<br/><br/></div></div><br/><br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/html.gif" style="margin:0px 2px -3px 0px"> HTML代码</div><div class="UBBContent"><TEXTAREA rows="8" id="temp62453">
<html>
<head>
	<title>自定义事件</title>
	<meta http-equiv=&#34;Content-Type&#34; content=&#34;text/html; charset=utf-8&#34; >
	<meta name=&#34;keywords&#34; content=&#34;&#34; >
	<meta name=&#34;description&#34; content=&#34;&#34; >
</head>
<body>



	<script type=&#34;text/javascript&#34;>
		<!--

	var foo = function(){ this.init.apply(this,arguments);};

	foo.prototype = {
		init:function(_name){
			this.name = _name;
			this.addEvent('click',document,this.say,this,'hello world!');
		},
		say:function(_ev,_word){
			alert(this.name +':' +_word);
			this.stop();
			this._onSay(_word);
		},
		stop:function(){
			this.removeEvent('click',document,this.say);
		},
		addEvent:function(_event,_element,_fn,_scope,_args){
			var args = Array.prototype.slice.call(arguments, 0);  
			ev = args.shift(),
			element = args.shift(),
			fn = args.shift(),
			scope = args.length>0?args.shift():window;
			element['e'+ev+fn] =  function(_ev){
				_ev == _ev || window.event;
				args.unshift(_ev);
				fn.apply(scope,args);
			};
			if (element.addEventListener) {
				element.addEventListener(ev, element['e'+ev+fn], false);
			} else if (element.attachEvent) {
				element.attachEvent(&#34;on&#34; +ev, element['e'+ev+fn]);
			}
		},
		removeEvent:function(_event,_element,_fn){
			if (_element.removeEventListener) {
				_element.removeEventListener(_event, _element['e'+_event+_fn], false);
			} else if (_element.detachEvent) {
				_element.detachEvent(&#34;on&#34; +_event, _element['e'+_event+_fn]);
			}
			try {
				del&#101;te _element['e'+_event+_fn];
			}catch(_ex){
				_element['e'+_event+_fn] = null;
			}
		},
		_onSay:function(){
			if(!this._onSayArray) return;	
			for(var i=0; i<this._onSayArray.length; i++){
				this._onSayArray[i].apply(this,arguments);
			}
		},
		addOnSay:function(_fn){
			if(!this._onSayArray) this._onSayArray = new Array();
			this._onSayArray.push(_fn);
		}
	}


var a = new foo('llinzzi');
a.addOnSay(function(_word){
	alert('事件1:'+this.name +'刚说了'+ _word);
});
a.addOnSay(function(_word){
	alert('事件2:'+this.name +'刚说了'+ _word);
});

		// -->
	</script>
</body>
</html>
</TEXTAREA><br/><INPUT onclick="runEx('temp62453')"  type="button" class="userbutton" value="运行此代码"/> <INPUT onclick="doCopy('temp62453')"  type="button" class="userbutton" value="复制此代码"/> <INPUT onclick="saveCode('temp62453')" type="button" class="userbutton" value="保存此代码"><br/> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]</div></div><br/><br/>实例通过addOnSay方法来增加事件响应，可以增加多个。<br/><br/>缺点，代码繁琐，如果要增加addOnSayAfter addOnSayBefore 就要增加很多代码。<br/><br/>再修改一下<br/><br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/><br/>&#160;&#160;&#160;&#160;var foo = function(){ this.init.apply(this,arguments);};<br/><br/>&#160;&#160;&#160;&#160;foo.prototype = {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;init:function(_name){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.name = _name;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.addEvent(&#39;click&#39;,document,this.say,this,&#39;hello world!&#39;);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;say:function(_ev,_word){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.fireEvent(&#39;saybefore&#39;,_word);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;alert(this.name +&#39;:&#39; +_word);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.stop();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.fireEvent(&#39;sayafter&#39;,_word);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;stop:function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.removeEvent(&#39;click&#39;,document,this.say);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;addEvent:function(_event,_element,_fn,_scope,_args){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var args = Array.prototype.slice.call(arguments, 0);&nbsp;&nbsp;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;ev = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;scope = args.length&gt;0?args.shift():window;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element[&#39;e&#39;+ev+fn] =&nbsp;&nbsp;function(_ev){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_ev == _ev || window.event;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;args.unshift(_ev);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn.apply(scope,args);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;};<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (element.addEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element.addEventListener(ev, element[&#39;e&#39;+ev+fn], false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (element.attachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element.attachEvent(&#34;on&#34; +ev, element[&#39;e&#39;+ev+fn]);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;removeEvent:function(_event,_element,_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (_element.removeEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.removeEventListener(_event, _element[&#39;e&#39;+_event+_fn], false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (_element.detachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.detachEvent(&#34;on&#34; +_event, _element[&#39;e&#39;+_event+_fn]);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;try {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;del&#101;te _element[&#39;e&#39;+_event+_fn];<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}catch(_ex){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element[&#39;e&#39;+_event+_fn] = null;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fireEvent:function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var args = Array.prototype.slice.call(arguments, 0);&nbsp;&nbsp;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var _event = args.shift();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(!this.cusEvents) return;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(!this.cusEvents[_event]) return;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;for(var i=0; i&lt;this.cusEvents[_event].length; i++){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.cusEvents[_event][i].apply(this,args);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;catchEvent:function(_event,_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(!this.cusEvents) this.cusEvents = {}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(!this.cusEvents[_event]) this.cusEvents[_event] = new Array();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.cusEvents[_event].push(_fn);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;}<br/><br/><br/>var a = new foo(&#39;llinzzi&#39;);<br/><br/>a.catchEvent(&#39;saybefore&#39;,function(_word){<br/>&#160;&#160;&#160;&#160;alert(&#39;事件1:&#39;+this.name +&#39;想说&#39;+ _word);<br/>});<br/><br/>a.catchEvent(&#39;sayafter&#39;,function(_word){<br/>&#160;&#160;&#160;&#160;alert(&#39;事件2:&#39;+this.name +&#39;刚说了&#39;+ _word);<br/>});<br/><br/></div></div><br/><br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/html.gif" style="margin:0px 2px -3px 0px"> HTML代码</div><div class="UBBContent"><TEXTAREA rows="8" id="temp40427">
<html>
<head>
	<title>自定义事件</title>
	<meta http-equiv=&#34;Content-Type&#34; content=&#34;text/html; charset=utf-8&#34; >
	<meta name=&#34;keywords&#34; content=&#34;&#34; >
	<meta name=&#34;description&#34; content=&#34;&#34; >
</head>
<body>



	<script type=&#34;text/javascript&#34;>
		<!--

	var foo = function(){ this.init.apply(this,arguments);};

	foo.prototype = {
		init:function(_name){
			this.name = _name;
			this.addEvent('click',document,this.say,this,'hello world!');
		},
		say:function(_ev,_word){
			this.fireEvent('saybefore',_word);
			alert(this.name +':' +_word);
			this.stop();
			this.fireEvent('sayafter',_word);
		},
		stop:function(){
			this.removeEvent('click',document,this.say);
		},
		addEvent:function(_event,_element,_fn,_scope,_args){
			var args = Array.prototype.slice.call(arguments, 0);  
			ev = args.shift(),
			element = args.shift(),
			fn = args.shift(),
			scope = args.length>0?args.shift():window;
			element['e'+ev+fn] =  function(_ev){
				_ev == _ev || window.event;
				args.unshift(_ev);
				fn.apply(scope,args);
			};
			if (element.addEventListener) {
				element.addEventListener(ev, element['e'+ev+fn], false);
			} else if (element.attachEvent) {
				element.attachEvent(&#34;on&#34; +ev, element['e'+ev+fn]);
			}
		},
		removeEvent:function(_event,_element,_fn){
			if (_element.removeEventListener) {
				_element.removeEventListener(_event, _element['e'+_event+_fn], false);
			} else if (_element.detachEvent) {
				_element.detachEvent(&#34;on&#34; +_event, _element['e'+_event+_fn]);
			}
			try {
				del&#101;te _element['e'+_event+_fn];
			}catch(_ex){
				_element['e'+_event+_fn] = null;
			}
		},
		fireEvent:function(){
			var args = Array.prototype.slice.call(arguments, 0);  
			var _event = args.shift();
			if(!this.cusEvents) return;
			if(!this.cusEvents[_event]) return;
			for(var i=0; i<this.cusEvents[_event].length; i++){
				this.cusEvents[_event][i].apply(this,args);
			}
		},
		catchEvent:function(_event,_fn){
			if(!this.cusEvents) this.cusEvents = {}
			if(!this.cusEvents[_event]) this.cusEvents[_event] = new Array();
			this.cusEvents[_event].push(_fn);
		}
	}


var a = new foo('llinzzi');

a.catchEvent('saybefore',function(_word){
	alert('事件1:'+this.name +'想说'+ _word);
});

a.catchEvent('sayafter',function(_word){
	alert('事件2:'+this.name +'刚说了'+ _word);
});

		// -->
	</script>
</body>
</html>

</TEXTAREA><br/><INPUT onclick="runEx('temp40427')"  type="button" class="userbutton" value="运行此代码"/> <INPUT onclick="doCopy('temp40427')"  type="button" class="userbutton" value="复制此代码"/> <INPUT onclick="saveCode('temp40427')" type="button" class="userbutton" value="保存此代码"><br/> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]</div></div><br/><br/>最后如果将catchEvent fireEvent addEvent removeEvent 单独放在一个类.EventHeloper<br/>将addEvent和catchEvent整合<br/>EventHeloper.addEvent(element/object,dom event/custom event,callback) 这样还是很方便的。<br/><br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/><br/>&#160;&#160;&#160;&#160;EventHelper = {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;Events:{Dom:{},Custom:{}},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;addEvent:function(_object,_event,_fn,_scope,_args){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var args = Array.prototype.slice.call(arguments, 0),&nbsp;&nbsp;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;obj = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;ev = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;scope = args.length&gt;0?args.shift():window;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var eType = obj.nodeType?&#39;Dom&#39;:&#39;Custom&#39;;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var fun;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(eType==&#39;Dom&#39;){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;sfn = function(_ev){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_ev == _ev || window.event;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;args.unshift(_ev);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn.apply(scope,args);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (obj.addEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;obj.addEventListener(ev,sfn, false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (obj.attachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;obj.attachEvent(&#34;on&#34; +ev,sfn);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}else {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;sfn = function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var __sargs = Array.prototype.slice.call(arguments, 0);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var _sargs = __sargs.concat(args);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn.apply(scope,_sargs);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}&#160;&#160;&#160;&#160;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fun = { fn:fn,sfn:sfn };<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.Events[eType][obj] = this.Events[eType][obj] || {};<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.Events[eType][obj][ev] = this.Events[eType][obj][ev] || new Array();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.Events[eType][obj][ev].push(fun);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;removeEvent:function(_object,_event,_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var obj = _object,<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;ev = _event,<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn = _fn;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var eType = obj.nodeType?&#39;Dom&#39;:&#39;Custom&#39;;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(!this.Events[eType][obj]) return;<br/><br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var fun;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;for( var i=0; i&lt;this.Events[eType][obj][ev].length;i++){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(fn == this.Events[eType][obj][ev][i].fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fun = this.Events[eType][obj][ev][i].sfn;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.Events[eType][obj][ev].splice(i,1);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;break;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(eType==&#39;Dom&#39;){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (obj.removeEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;obj.removeEventListener(ev, fun, false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (obj.detachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;obj.detachEvent(&#34;on&#34; + ev, fun);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/><br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fireEvent:function(_object,_event){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var args = Array.prototype.slice.call(arguments, 0),&nbsp;&nbsp;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;obj = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;ev = args.shift();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var eType = &#39;Custom&#39;;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if((!this.Events[eType][obj]) || (!this.Events[eType][obj][ev])) return;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;for(var i=0; i&lt;this.Events[eType][obj][ev].length; i++){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.Events[eType][obj][ev][i].sfn.apply(window,args);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;}<br/><br/><br/></div></div><br/><br/>修改一下演示的例子<br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/html.gif" style="margin:0px 2px -3px 0px"> HTML代码</div><div class="UBBContent"><TEXTAREA rows="8" id="temp79948">
<html>
<head>
	<title>自定义事件</title>
	<meta http-equiv=&#34;Content-Type&#34; content=&#34;text/html; charset=utf-8&#34; >
	<meta name=&#34;keywords&#34; content=&#34;&#34; >
	<meta name=&#34;description&#34; content=&#34;&#34; >
</head>
<body>



	<script type=&#34;text/javascript&#34;>
		<!--

	EventHelper = {
		Events:{Dom:{},Custom:{}},
		addEvent:function(_object,_event,_fn,_scope,_args){
			var args = Array.prototype.slice.call(arguments, 0),  
				obj = args.shift(),
				ev = args.shift(),
				fn = args.shift(),
				scope = args.length>0?args.shift():window;
			var eType = obj.nodeType?'Dom':'Custom';
			var fun;
			if(eType=='Dom'){
				sfn = function(_ev){
					_ev == _ev || window.event;
					args.unshift(_ev);
					fn.apply(scope,args);
				}
				if (obj.addEventListener) {
					obj.addEventListener(ev,sfn, false);
				} else if (obj.attachEvent) {
					obj.attachEvent(&#34;on&#34; +ev,sfn);
				}
			}else {
				sfn = function(){
					var __sargs = Array.prototype.slice.call(arguments, 0);
					var _sargs = __sargs.concat(args);
					fn.apply(scope,_sargs);
				}	
			}
			fun = { fn:fn,sfn:sfn };
			this.Events[eType][obj] = this.Events[eType][obj] || {};
			this.Events[eType][obj][ev] = this.Events[eType][obj][ev] || new Array();
			this.Events[eType][obj][ev].push(fun);
		},
		removeEvent:function(_object,_event,_fn){
			var obj = _object,
				ev = _event,
				fn = _fn;
			var eType = obj.nodeType?'Dom':'Custom';
			if(!this.Events[eType][obj]) return;

			var fun;
			for( var i=0; i<this.Events[eType][obj][ev].length;i++){
				if(fn == this.Events[eType][obj][ev][i].fn){
					fun = this.Events[eType][obj][ev][i].sfn;
					this.Events[eType][obj][ev].splice(i,1);
					break;
				}
			}
			if(eType=='Dom'){
				if (obj.removeEventListener) {
					obj.removeEventListener(ev, fun, false);
				} else if (obj.detachEvent) {
					obj.detachEvent(&#34;on&#34; + ev, fun);
				}
			}

		},
		fireEvent:function(_object,_event){
			var args = Array.prototype.slice.call(arguments, 0),  
				obj = args.shift(),
				ev = args.shift();
			var eType = 'Custom';
			if((!this.Events[eType][obj]) || (!this.Events[eType][obj][ev])) return;
			for(var i=0; i<this.Events[eType][obj][ev].length; i++){
				this.Events[eType][obj][ev][i].sfn.apply(window,args);
			}
		}
	}



	var foo = function(){ this.init.apply(this,arguments);};

	foo.prototype = {
		init:function(_name){
			this.name = _name;
			EventHelper.addEvent(document,'click',this.say,this,'hello world!');
		},
		say:function(_ev,_word){
			EventHelper.fireEvent(this,'saybefore',_word);
			alert(this.name +':' +_word);
			this.stop();
			EventHelper.fireEvent(this,'sayafter',_word);
		},
		stop:function(){
			EventHelper.removeEvent(document,'click',this.say);
		}
	}


	var a = new foo('llinzzi');

	function sayBefore(_word,_word2){
		alert('事件1:'+this.name +'想说'+ _word+_word2);
	}
	function sayAfter(_word){
		alert('事件2:'+this.name +'刚说了'+ _word);
	}

	EventHelper.addEvent(a,'saybefore',sayBefore,a,'外部的数据');
	//EventHelper.removeEvent(a,'saybefore',sayBefore);
	EventHelper.addEvent(a,'sayafter',sayBefore,a);

	

		// -->
	</script>
</body>
</html>


</TEXTAREA><br/><INPUT onclick="runEx('temp79948')"  type="button" class="userbutton" value="运行此代码"/> <INPUT onclick="doCopy('temp79948')"  type="button" class="userbutton" value="复制此代码"/> <INPUT onclick="saveCode('temp79948')" type="button" class="userbutton" value="保存此代码"><br/> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]</div></div><br/><br/>上面例子的 EventHelper.addEvent方法可以增加自定义事件或者原生的事件<br/>EventHelper.addEvent(document,&#39;click&#39;,function(){alert(&#39;hello&#39;);}); // 原生事件<br/>EventHelper.addEvent(foo,&#39;say&#39;,function(){alert(&#39;hello&#39;);}); // 自定义时间<br/><br/>对应的EventHelper.removeEvent也可以移除自定义事件。<br/><br/>]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=125</link>
			<title><![CDATA[IE下的强大调试工具DebugBar]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[JS Ajax]]></category>
			<pubDate>Wed,26 Nov 2008 09:03:37 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=125</guid>
		<description><![CDATA[一直以为Core Services的DebugBar是收费的，今天才发现针对个人用户是免费的。<br/><br/>著名的IETester也是Core Services公司的产品。<br/><br/>还有能让ie支持console.log()的CompanionJS。<br/><br/>DebugBar可以号称IE下的FireBug了。<br/><br/>见截图。<br/><br/><br/><img src="http://onewww.net/blog/attachments/month_0811/k200811269624.gif" border="0" alt=""/><br/><br/><img src="http://onewww.net/blog/attachments/month_0811/f200811269721.gif" border="0" alt=""/><br/><br/><img src="http://onewww.net/blog/attachments/month_0811/e200811269741.gif" border="0" alt=""/><br/><br/><br/>下载地址<br/><a href="http://www.debugbar.com/download.php" target="_blank" rel="external">http://www.debugbar.com/download.php</a><br/><br/>个人用户的注册方法<br/><a href="http://www.debugbar.com/register/index.php" target="_blank" rel="external">http://www.debugbar.com/register/index.php</a><br/><br/><br/><br/>==================================================================<br/>还有一个更强力的 IE WebDeveloper ， 但是要收费<br/><br/><img src="http://www.ieinspector.com/dominspector/images/webpage_inspector_l.gif" border="0" alt=""/><br/><br/><img src="http://www.ieinspector.com/dominspector/images/sourceexplorer_l.gif" border="0" alt=""/><br/><br/>下载<br/><a href="http://www.ieinspector.com/dominspector/download.html" target="_blank" rel="external">http://www.ieinspector.com/dominspector/download.html</a>]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=124</link>
			<title><![CDATA[JavaScript面向对象编程[二] 事件处理]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[JS Ajax]]></category>
			<pubDate>Thu,20 Nov 2008 17:06:32 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=124</guid>
		<description><![CDATA[继 &lt; JavaScript面向对象编程[一] 构造函数 &gt;(<a href="http://onewww.net/blog/article.asp?id=106" target="_blank" rel="external">http://onewww.net/blog/article.asp?id=106</a>)<br/><br/>如果采用上篇文章的方法构建的类，如果要处理事件按通常的写法会造成回调函数作用域丢失。<br/><br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/><br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var foo = function(){ this.init.apply(this,arguments);};<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;foo.prototype = {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;init:function(_name){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; this.name = _name;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; this.addEvent(&#39;click&#39;,document,this.say);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;say:function(_ev){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;alert(this.name);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.stop();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;stop:function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; this.removeEvent(&#39;click&#39;,document,this.say);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&nbsp;&nbsp;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;addEvent:function(_event,_element,_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (_element.addEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.addEventListener(_event, _fn, false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (_element.attachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.attachEvent(&#34;on&#34; +_event,_fn);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} <br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;removeEvent:function(_event,_element,_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (_element.removeEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.removeEventListener(_event, _fn, false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (_element.detachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.detachEvent(&#34;on&#34; +_event, _fn);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/><br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var a = new foo(&#39;llinzzi&#39;);<br/><br/></div></div><br/><br/>以上代码可以观察到this.say的alert方法已经调用，但内部的this.name已经不存在了，因为找不到this了。并且如果要像say里面传值似乎也比较麻烦。<br/><br/><br/>解决this丢失和传值问题的代码，并解决传this后不能注销事件的问题。<br/><br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var foo = function(){ this.init.apply(this,arguments);};<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;foo.prototype = {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;init:function(_name){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; this.name = _name;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; this.addEvent(&#39;click&#39;,document,this.say,this,&#39;hello world!&#39;);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;say:function(_ev,_word){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;alert(this.name +&#39;:&#39; +_word);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.stop();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;stop:function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; this.removeEvent(&#39;click&#39;,document,this.say);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&nbsp;&nbsp;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;addEvent:function(_event,_element,_fn,_scope,_args){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var args = this._toArray(arguments),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;ev = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn = args.shift(),<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;scope = args.length&gt;0?args.shift():window;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element[&#39;e&#39;+ev+fn] =&nbsp;&nbsp;function(_ev){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_ev == _ev || window.event;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;args.unshift(_ev);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;fn.apply(scope,args); <br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;};<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (element.addEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element.addEventListener(ev, element[&#39;e&#39;+ev+fn], false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (element.attachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;element.attachEvent(&#34;on&#34; +ev, element[&#39;e&#39;+ev+fn]);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} <br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;removeEvent:function(_event,_element,_fn){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (_element.removeEventListener) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.removeEventListener(_event, _element[&#39;e&#39;+_event+_fn], false);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} else if (_element.detachEvent) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element.detachEvent(&#34;on&#34; +_event, _element[&#39;e&#39;+_event+_fn]);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;} <br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;try {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;del&#101;te _element[&#39;e&#39;+_event+_fn];<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}catch(_ex){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element[&#39;e&#39;+_event+_fn] = null;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_toArray:function(iterable){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (!iterable) return [];<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (iterable.toArray) return iterable.toArray();<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var length = iterable.length || 0, results = new Array(length);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;while (length--) results[length] = iterable[length];<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;return results;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/><br/><br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var a = new foo(&#39;llinzzi&#39;);<br/><br/></div></div><br/><br/>下一次会分享一下在用面向对象编程过程中的一些心得，有关设计模式的一些整理。]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=123</link>
			<title><![CDATA[JavaScript获取准确的行高]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[JS Ajax]]></category>
			<pubDate>Wed,19 Nov 2008 09:39:37 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=123</guid>
		<description><![CDATA[需求：n多行文字的div，隐藏超过5行的部分。<br/>分析：我能想到的有2种思路，一种是计算5行的文字个数，重新innerHTML。第二种给div设置高度，沿着第二个思路往下走，就是设置div的高度为5×lineheigh。<br/>解决：任务锁定到货的lineheight的问题上。css的设置会影响到lineheight。所以首先要获得css的lineheight与fontsize，如果有padding的话，也可以算进去。<br/><br/>相关知识点：<br/>1，获取css不能通过element.style的方式，这只能获得内联样式，获得不到样式表中的定义。需要采用二级DOM。<br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/>&#160;&#160;&#160;&#160;var style = _element.currentStyle || document.defaultView.getComputedStyle(_element,null);<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var value = style[_property]<br/></div></div><br/>2，ie返回的单位是pt，ff返回的是px。需要pt到px的转换<br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/>&#160;&#160;&#160;&#160;var px = parseInt(pt)*((1/72)*screen.deviceXDPI) +&#39;px&#39;;<br/></div></div><br/>3，ie在没有设置lineheight的情况下会返回‘normal&#39;，normal的数值究竟是多少？浏览器的默认高度是多少？没找到理论依据，希望了解的朋友提供下。我计算出来的如下公式。ie和ff都如此，但ff是可以读出默认数值的。所以似乎也没有计算的必要。<br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/>var defaultLineheight = fontsize*(7/6);<br/></div></div><br/><br/>把以上代码攒起来，封装一个设置隐藏多余行的类<br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/>(function(){<br/><br/> var AutoOverHider = function() { this.init.apply(this,arguments);};<br/><br/> AutoOverHider.prototype = {<br/> &#160;&#160;&#160;&#160;init:function(_element,_maxLine){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.element = document.getElementById(_element);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(_maxLine) this.hide(_maxLine);<br/>&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;hide:function(_maxLine){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.maxLine = _maxLine;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var lineHeight = this._getStyle(&#39;lineHeight&#39;);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(lineHeight==&#39;normal&#39;) { lineHeight = 7/6+&#39;&#39;;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(lineHeight.substr(lineHeight.length-2)!=&#39;px&#39;)&#160;&#160;&#160;&#160;lineHeight = lineHeight * parseInt(this._getStyle(&#39;fontSize&#39;)) + &#39;px&#39;;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var paddingHeight = this._getStyle(&#39;paddingBottom&#39;);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;alert(paddingHeight);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.height =&nbsp;&nbsp;this.maxLine * parseInt(lineHeight) - parseInt(paddingHeight);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.element.style.height = this.height&nbsp;&nbsp;+ &#39;px&#39;;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.element.style.overflow = &#39;hidden&#39;;<br/>&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;show:function(){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;this.element.style.height = &#39;auto&#39;;<br/>&#160;&#160;&#160;&#160;},<br/>&#160;&#160;&#160;&#160;_getStyle:function(_property,_element){<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;_element = _element||this.element;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var style = _element.currentStyle || document.defaultView.getComputedStyle(_element,null);<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var value = style[_property]<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(/*@cc_on!@*/0 ) {<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if(value.substr(value.length-2)==&#39;pt&#39;)<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;value = parseInt(value)*((1/72)*screen.deviceXDPI) +&#39;px&#39;;<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;}<br/>&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;return value;<br/>&#160;&#160;&#160;&#160;}<br/> };<br/> <br/> <br/>})()<br/></div></div><br/><br/>调用<br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/>&lt;div id=&#34;t1&#34;&gt;<br/>千余字<br/>&lt;/div&gt;<br/><br/> var a1 = new AutoOverHider(&#39;t1&#39;);<br/> a1.hide(5);<br/>或者<br/> var a1 = new AutoOverHider(&#39;t1&#39;，5);<br/></div></div>]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=122</link>
			<title><![CDATA[macbook重装系统]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[Site Life Play]]></category>
			<pubDate>Tue,21 Oct 2008 20:38:36 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=122</guid>
		<description><![CDATA[朋友一台macbook系统坏了，让我拿来修一下。此前我也没玩过mac os x<br/>10.4的系统，也顺便想升级到10.5 印象里重新安装10.5比升级更方便些。<br/>下载了一个10.5的镜像6.6G，下了3天，开始还挺开心，后来反应过来一张4.7的dvd刻不下。。去找了下h9的dvd碟，没买到。<br/>于是回来琢磨怎么硬盘安装，可以用火线的ipod来安装，可我没有。<br/>还有一套方案是先给本分区，分2个驱，把镜像恢复到第二个分区，第二个分区就变成了安装盘，重启可引导。<br/>可用bootcamp分区，由于是10.4的系统 所以只能用1.4的bootcamp， 好不容易下载到，提示已过期，吐血 修改系统时间，搞定，安装后提示硬盘损坏，然我修复，于是修复之，修复提示无法修复。。玩我。。<br/>第二天和克军借了一张macbook的10.5.4的系统盘，和文丞借了个macbook pro的10.5.2的盘，兴冲冲的放进去光驱（10.5.4的）。启动，提示该mac os x 无法安装到此机器。于是马上格式化硬盘，心想是不是原系统作怪。格式化后还不行，再放10.5.2的盘，问题依旧。。 google之，结论是原装机器带的盘不能换别的老机型上。<br/>想了下，光盘引导系统，磁盘工具，把硬盘分2个区，插上移动硬盘里面有之前下的10.5的6.6g那个镜像，在磁盘工具里直接设置下把第二个硬盘恢复为6.6的镜像，吃饭，吃完后发现已经完事，重启，搞定。<br/>]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=121</link>
			<title><![CDATA[1500出售闲置AppleTV]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[Site Life Play]]></category>
			<pubDate>Wed,15 Oct 2008 11:09:08 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=121</guid>
		<description><![CDATA[<strong>已售出</strong><br/><br/>本来是想买来装上linux当服务器玩的，后来因为没有显示器（apple tv要求的显示器接口是HDMI，租的房子的电视也很差，不支持色差线），配置起来不方便，所以也没玩起来，也懒的折腾了，就卖了。<br/><br/>现在appletvhacks.net介绍appleTV已经可以完全被破解了 可以播放任何格式的影片。<br/>机器成色全新，因为基本就没用过。不过拆过，因为要hack成linux 40G版<br/><br/><img src="http://img2.zol.com.cn/product/10_450x337/490/ceerxEYr6K5XQ.jpg" border="0" alt=""/><br/><br/>相关资料<br/><a href="http://www.appl&#101;tvhacks.net" target="_blank" rel="external">http://www.appl&#101;tvhacks.net</a><br/><br/><a target="_blank" href="http://auction1.taobao.com/auction/item_detail-0db2-af6208ccf33de174802f75aed17251bc.jhtml" rel="external">淘宝链接</a><br/><br/>需要的朋友留言或加msn llinzzi@gmail.com<br/><br/><br/>]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=120</link>
			<title><![CDATA[Chrome的hack写法以及CSS的支持程度]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[Html CSS XML]]></category>
			<pubDate>Thu,04 Sep 2008 10:58:52 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=120</guid>
		<description><![CDATA[Chrome的CSS支持程度 引用自 <a target="_blank" href="http://www.evotech.net/blog/2008/09/google-chrome-browser-css-sel&#101;ctor-support/" rel="external">Estelle</a><br/><br/><img src="http://onewww.net/blog/attachments/month_0809/3200894104836.jpg" border="0" alt=""/><br/><br/><img src="http://onewww.net/blog/attachments/month_0809/o200894105012.png" border="0" alt=""/><br/><br/>Chrome的hack写法 引用自 <a target="_blank" href="http://www.evotech.net/blog/2008/09/css-hack-for-google-chrome-and-safari-31/" rel="external">Estelle</a><br/><br/><div class="UBBPanel codePanel"><div class="UBBTitle"><img src="http://onewww.net/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/>body:nth-of-type(1) p{<br/>&nbsp;&nbsp; color: #333333;<br/>}<br/></div></div><br/>Only the Google Chrome and Safari 3.1 browsers will show paragraphs as red. <br/>]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=119</link>
			<title><![CDATA[JS框架检测器 - YUI Monitor]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[JS Ajax]]></category>
			<pubDate>Thu,04 Sep 2008 10:37:32 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=119</guid>
		<description><![CDATA[当打开网站的时候能检测到网站的js框架及其版本（如：YUI jquery prototype）<br/><br/><br/><img src="http://onewww.net/blog/attachments/month_0809/i20089410343.jpg" border="0" alt=""/><br/><br/><br/><img src="http://onewww.net/blog/attachments/month_0809/0200894103552.jpg" border="0" alt=""/><br/><br/>安裝 <a target="_blank" href="https://addons.mozilla.org/zh-TW/firefox/addon/748" rel="external">Greasemonkey</a><br/>安裝 <a target="_blank" href="http://josephj.com/article/yui-monitor/yuimonitor.user.js" rel="external">YUI Monitor</a><br/><br/>]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=118</link>
			<title><![CDATA[firefox插件 记录优酷的播放记录]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[JS Ajax]]></category>
			<pubDate>Fri,18 Jul 2008 17:12:18 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=118</guid>
		<description><![CDATA[经常上优酷看电视剧，卡通等。第二天继续看的时候又不记得上次看到哪了，当然你可以去浏览器的历史记录里找，不过很麻烦。写了个greasemonkey的小扩展，<a target="_blank" href="https://addons.mozilla.org/zh-CN/firefox/addon/748" rel="external">下载greasemonkey</a>，可以记录前几次的播放地址，当播放可以自动切换的专辑列表的时候也可以正常记录。<br/><br/>youku-playlist <a target="_blank" href="http://cn.yimg.com/i/temp/youku-playlist.user.js" rel="external">安装</a><br/><br/>安装到greasemonkey后，再看过视频后，下次打开首页，会在首页底部看到列表。<br/><br/><br/><br/><br/>]]></description>
		</item>
		
			<item>
			<link>http://onewww.net/blog/article.asp?id=117</link>
			<title><![CDATA[基于YUI的城市联动组件]]></title>
			<author>LlinZzi(at)gmail(dot)com(llinzzi)</author>
			<category><![CDATA[JS Ajax]]></category>
			<pubDate>Tue,20 May 2008 09:29:40 +0800</pubDate>
			<guid>http://onewww.net/blog/default.asp?id=117</guid>
		<description><![CDATA[参加过D2的朋友会对YUI印象比较深刻吧 ；）<br/>//城市级联<br/>//特点 支持3级连动 2级联动 <br/>//后期加载数据采用js方式可跨域,也会本地缓存<br/>//<span style="color:Red">可以前期绑定城市状态，方便在修改页面进行使用</span><br/>//回调事件<br/><br/><a target="_blank" href="http://onewww.net/lab/yui/citySel&#101;cter/demo.html" rel="external">demo</a><br/><br/>手里没有区的信息，那个朋友有提供下<br/>]]></description>
		</item>
		
</channel>
</rss>
