📄 3.html
字号:
<option value="#E4E1D8" class="readModeGrayE4E"> </option>
<option value="#E6E6E6" class="readModeGray6E6"> </option>
<option value="#EEFAEE" class="readModeEEFAEE"> </option>
<option value="#FFFFED" class="readModeYellow"> </option>
</select>
鼠标双击滚屏
<select id="no5" onChange="setStep(this.options[this.selectedIndex].value)">
<option value="400">10</option>
<option value="300">09</option>
<option value="200">08</option>
<option value="150">07</option>
<option value="120">06</option>
<option value="100" selected="selected">05</option>
<option value="50">04</option>
<option value="40">03</option>
<option value="30">02</option>
<option value="10">01</option>
</select>
<span style="color:#737373">(1最快,10最慢)</span>
<button class="cl3" onClick="saveMode()" alt="save" ></button>
<button class="cl2" id="cl" onClick="_blog_load_js();" disabled="true" >转为繁体</button>
<button class="cl4" id="cl" onClick="javascript:window.close()" alt="close"></button>
</div>
</div>
<div id="readModeTxt" class="readModeTxtBox">
<div id="ArticleTitle">
Dojo 教程 笔记 (转载) 三 </div>
<div id="AuthorReadMode">
<span id="Author">作者：小说</span>
<span id="PublicTime">2008-01-18 02:09:58</span>
</div>
<table width="480" border="0" cellpadding="0" cellspacing="0" class="reader_tag" align="center">
<tr>
<td width="60" height="20" align="right">标签：</td>
<td colspan="4" rowspan="2" align="center" valign="top"><div class="tagItem"><a href="http://search.blog.sina.com.cn/blog/search?q=dojo&tag=n&t=tag" target="_blank">dojo</a></div><div class="tagItem"><a href="http://search.blog.sina.com.cn/blog/search?q=%BD%CC%B3%CC&tag=n&t=tag" target="_blank">教程</a></div><div class="tagItem"><a href="http://search.blog.sina.com.cn/blog/search?q=it&tag=n&t=tag" target="_blank">it</a></div> <div style="clear:both"></div>
</td>
</tr>
<tr>
<td width="60" height="20"> </td>
</tr>
</table>
<div id="Content" style="word-wrap:break-word;word-break:break-all;overflow:hidden;" onselectstart="return false;">
<div>
<p>Dojo学习笔记(8. dojo.event & dojo.event.topic &
dojo.event.browser)</P>
<p>模块：dojo.event</P>
<p>
终于进入有名的dojo事件处理系统的学习了，学习前建议读者先去补习一下AOP的相关知识</P>
<p>dojo.event.connect</P>
<p>绑定指定的方法到指定的对象的方法上</P>
<p>Usage Example:</P>
<p>简单绑定1</P>
<p>function doOnClick1()<br/>
{<br/>
alert("Clicked!");<br/>
}<br/>
dojo.event.connect(dojo.byId("inputTest"),"onclick","doOnClick1");</P>
<p>简单绑定2</P>
<p>obj = { doOnClick2: function(){ alert("Clicked!");}}<br/>
dojo.event.connect(dojo.byId("inputTest"),"onclick",obj,"doOnClick2");</P>
<p>
如果存在需要进行多个事件的绑定的时候，你就会看到dojo的方便之处了</P>
<p>obj2 = { doOnClick2: function(){alert("Clicked!");}}<br/>
dojo.event.connect(dojo.byId("inputTest"),"onclick",obj,"doOnClick2");<br/>
dojo.event.connect(dojo.byId("inputTest"),"onclick",obj2,"doOnClick2");</P>
<p>connect可以对任何对象的方法进行绑定，而不是只能针对DOM对象</P>
<p>dojo.event.connect(obj,"doOnclick2","doOnClick1");<br/>
//在调用obj.doOnclick2()后调用doOnClick1()</P>
<p>dojo.event.connectBefore</P>
<p>
dojo.event.connect默认是后绑定，connectBefore则是早绑定，绑定的方法将在指定方法前执行，<br/>
用法与connect一致</P>
<p>dojo.event.connectAround</P>
<p>Usage Example:</P>
<p>function aroundTest(invocation){<br/>
//此处可以增加代码，比如检查参数(invocation.args)<br/>
var result = invocation.proceed();<br/>
//此处可以增加代码，比如修改结果(result)<br/>
return result;<br/>
}<br/>
dojo.event.connectAround(dojo.byId("inputTest"),"onclick","aroundTest");</P>
<p>dojo.event.connectOnce<br/>
说起这个函数，还真的是让我想了半天，直觉上我就把它想象成executeOnce，结果测试的结果让我<br/>
差点想不通<br/>
connectOnce就是指保证只绑定一次，来避免重复绑定会导致的重复执行的问题</P>
<p>dojo.event.disconnect</P>
<p>解除绑定，调用参数与connect一致，即可解除之前的绑定操作</P>
<p>dojo.event.log</P>
<p>在执行指定对象的指定方法后自动记录日志</P>
<p>Usage Example:</P>
<p>dojo.event.log(obj, "doOnClick");<br/>
//当调用obj.doOnClick时记录下日志"DEBUG: ([object
Object]).doOnClick : "</P>
<p>你也可以这样写：</P>
<p>dojo.event.log({srcObj: obj, srcFunc: "doOnClick"});</P>
<p>dojo.event.kwConnect</P>
<p>kwConnect可以做到更加灵活的绑定，比如可以设置延迟执行绑定</P>
<p>Usage Example:</P>
<p>dojo.event.kwConnect({<br/>
srcObj: dojo.byId("inputTest"),<br/>
srcFunc: "onclick",<br/>
adviceObj: obj,<br/>
adviceFunc: "doOnclick2",</P>
<p>type: "before",<br/>
//默认为"after"，可选: "before",
"around"，注意：type是用来决定adviceFunc的行为的，<br/>
//如果为"around"，则aroundFunc将失效<br/>
aroundObj: null,<br/>
aroundFunc: null,
//如果指定了aroundFunc，则其将对adviceFunc进行拦截，<br/>
//但是当type为"around"时，则aroundFunc将不会执行<br/>
once: false, //默认为false，允许重复绑定<br/>
delay: 3000, //延时3秒后执行adviceFunc<br/>
rate: 0, //这个从源代码没有看懂起什么作用<br/>
adviceMsg: false //这个从源代码没有看懂起什么作用<br/>
});</P>
<p>dojo.event.kwDisconnect</P>
<p>用来解除使用kwConnect指定的绑定</P>
<p>模块：dojo.event.topic</P>
<p>
Topic机制与Advice机制都能够实现事件的绑定，但是显然,Topic更适合处理多重绑定。<br/>
发布主题，然后由用户订阅的机制就是一个典型的观察者模式</P>
<p>dojo.event.topic.registerPublisher</P>
<p>注册主题发布器</P>
<p>Usage Example:</P>
<p>dojo.event.topic.registerPublisher("myTopic", obj,
"doOnClick2");</P>
<p>dojo.event.topic.subscribe</P>
<p>订阅主题</P>
<p>Usage Example:</P>
<p>dojo.event.topic.subscribe("myTopic", "test");
//执行obj.doOnClick2()以后会自动执行test()</P>
<p>dojo.event.topic.unsubscribe</P>
<p>取消订阅主题</P>
<p>Usage Example:</P>
<p>dojo.event.topic.unsubscribe("myTopic", "test");</P>
<p>dojo.event.topic.destroy</P>
<p>删除主题，此主题所有的订阅都将失效</P>
<p>Usage Example:</P>
<p>dojo.event.topic.destroy("myTopic");</P>
<p>模块：dojo.event.browser</P>
<p>dojo.event.browser.addListener</P>
<p>增加监听器</P>
<p>Usage Example:</P>
<p>function listener()<br/>
{<br/>
alert("ok");<br/>
}<br/>
dojo.event.browser.addListener(document, 'mousedown',
listener);<br/>
//事件名称可以加上"on"，也可以没有"on"<br/>
dojo.event.browser.addListener(document, 'onmousedown', listener,
true);<br/>
//capture为真表示不受上层元素的事件控制</P>
<p>dojo.event.browser.removeListener</P>
<p>清除监听器(这个方法似乎是无效的)</P>
<p>dojo.event.browser.callListener</P>
<p>调用监听器</P>
<p>Usage Example:</P>
<p>dojo.event.browser.callListener(listener, document);</P>
<p>dojo.event.browser.stopPropagation</P>
<p>阻止Event传播</P>
<p>Usage Example:</P>
<p>dojo.event.browser.stopPropagation();</P>
<p>dojo.event.browser.preventDefault</P>
<p>将当前事件的返回值设置为false</P>
<p>Usage Example:</P>
<p>dojo.event.browser.preventDefault();</P>
<p>dojo.event.browser.keys</P>
<p>键定义:<br/>
KEY_BACKSPACE: 8,<br/>
KEY_TAB: 9,<br/>
KEY_ENTER: 13,<br/>
KEY_SHIFT: 16,<br/>
KEY_CTRL: 17,<br/>
KEY_ALT: 18,<br/>
KEY_PAUSE: 19,<br/>
KEY_CAPS_LOCK: 20,<br/>
KEY_ESCAPE: 27,<br/>
KEY_SPACE: 32,<br/>
KEY_PAGE_UP: 33,<br/>
KEY_PAGE_DOWN: 34,<br/>
KEY_END: 35,<br/>
KEY_HOME: 36,<br/>
KEY_LEFT_ARROW: 37,<br/>
KEY_UP_ARROW: 38,<br/>
KEY_RIGHT_ARROW: 39,<br/>
KEY_DOWN_ARROW: 40,<br/>
KEY_INSERT: 45,<br/>
KEY_DELETE: 46,<br/>
KEY_LEFT_WINDOW: 91,<br/>
KEY_RIGHT_WINDOW: 92,<br/>
KEY_SELECT: 93,<br/>
KEY_F1: 112,<br/>
KEY_F2: 113,<br/>
KEY_F3: 114,<br/>
KEY_F4: 115,<br/>
KEY_F5: 116,<br/>
KEY_F6: 117,<br/>
KEY_F7: 118,<br/>
KEY_F8: 119,<br/>
KEY_F9: 120,<br/>
KEY_F10: 121,<br/>
KEY_F11: 122,<br/>
KEY_F12: 123,<br/>
KEY_NUM_LOCK: 144,<br/>
KEY_SCROLL_LOCK: 145</P>
<p>dojo.event.browser.currentEvent</P>
<p>最近一次的Event，其属性包括：</P>
<p>altKey //检查alt键的状态，当alt键按下时，值为 true<br/>
button //检查按下的鼠标键，0 没按键，1 按左键，2 按右键，3
按左右键，4 按中间键，<br/>
5 按左键和中间键，6 按右键和中间键，7 按所有的键<br/>
//这个属性仅用于onmousedown, onmouseup, 和 onmousemove
事件。对其他事件，不管鼠标状态如何，<br/>
都返回 0（比如onclick）<br/>
clientX //返回鼠标在窗口客户区域中的X坐标<br/>
clientY //返回鼠标在窗口客户区域中的Y坐标<br/>
ctrlKey //检查ctrl键的状态，当ctrl键按下时，值为 true<br/>
fromElement //检测 onmouseover 和 onmouseout
事件发生时，鼠标所离开的元素<br/>
keyCode
//检测键盘事件相对应的内码，仅当type为keydown,keyup,keypress时才有效<br/>
offsetX //检查相对于触发事件的对象，鼠标位置的水平坐标<br/>
offsetY //检查相对于触发事件的对象，鼠标位置的垂直坐标<br/>
propertyName //设置或返回元素的变化了的属性的名称，你可以通过使用
onpropertychange 事件，<br/>
得到 propertyName 的值<br/>
screenX //检测鼠标相对于用户屏幕的水平位置<br/>
screenY //检测鼠标相对于用户屏幕的垂直位置<br/>
shiftKey //检查shift键的状态，当shift键按下时，值为true<br/>
srcElement //返回触发事件的元素<br/>
srcFilter //返回触发 onfilterchange 事件的滤镜<br/>
toElement //检测 onmouseover 和 onmouseout
事件发生时，鼠标所进入的元素<br/>
type //返回没有“on”作为前缀的事件名，比如click, mousedown<br/>
x
//返回鼠标相对于css属性中有position属性的上级元素的x轴坐标。<br/>
如果没有css属性中有position属性的上级元素，默认以BODY元素作为参考对象<br/>
y
//返回鼠标相对于css属性中有position属性的上级元素的y轴坐标。<br/>
如果没有css属性中有position属性的上级元素，默认以BODY元素作为参考对象<br/>
target //同srcElement<br/>
currentTarget<br/>
layerX //同offsetX<br/>
layerY //同offsetY<br/>
pageX //无水平滚动条的情况下与clientX同<br/>
pageY //无水平滚动条的情况下与clientY同<br/>
relatedTarget // 仅当type为mouseover,mouseout时才有效<br/>
keys
//与dojo.event.browser.keys相同，仅当type为keydown,keyup,keypress时才有效<br/>
charCode //键值，仅当type为keypress时才有效</P>
<p>dojo.event.browser.isEvent</P>
<p>判断指定对象是否为event对象</P>
<p>Usage Example:</P>
<p>
dojo.event.browser.isEvent(dojo.event.browser.currentEvent);<br/>
//当dojo.event.browser.currentEvent不为null时返回true</P>
<p>
///////////////////////////////////////////////////////////////////////////////////////////</P>
<p>Dojo学习笔记(9. dojo.graphics.color & dojo.uri.Uri)</P>
<p>模块：dojo.graphics.color</P>
<p>下面是dojo里定义的颜色名称<br/>
dojo.graphics.color.named.white //白色<br/>
dojo.graphics.color.named.black //黑色<br/>
dojo.graphics.color.named.red //红色<br/>
dojo.graphics.color.named.green //绿色<br/>
dojo.graphics.color.named.blue //蓝色<br/>
dojo.graphics.color.named.navy //海军蓝<br/>
dojo.graphics.color.named.gray //灰色<br/>
dojo.graphics.color.named.silver//银色</P>
<p>dojo.graphics.color.Color</P>
<p>颜色类</P>
<p>Usage Example:</P>
<p>var color = new
dojo.graphics.color.Color(dojo.graphics.color.named.black);<br/>
//定义一个黑色的颜色对象<br/>
var color = new dojo.graphics.color.Color(0,0,0);
//定义一个黑色的颜色对象<br/>
var color = new dojo.graphics.color.Color(0,0,0,1.0);
//定义一个黑色的颜色对象<br/>
var color = new dojo.graphics.color.Color([0,0,0,1.0]);
//定义一个黑色的颜色对象<br/>
var color = new dojo.graphics.color.Color('rgb(0,0,0)');
//定义一个黑色的颜色对象<br/>
var color = new dojo.graphics.color.Color('#000000');
//定义一个黑色的颜色对象</P>
<p>dojo.graphics.color.Color.toRgb</P>
<p>Usage Example:</P>
<p>color.toRgb(); //返回一个[0,0,0]的数组<br/>
color.toRgb(true); //返回一个[0,0,0,1.0]的数组</P>
<p>dojo.graphics.color.Color.toRgba</P>
<p>Usage Example:</P>
<p>color.toRgba(); //返回一个[0,0,0,1.0]的数组</P>
<p>dojo.graphics.color.Color.toHex<br/>
dojo.graphics.color.Color.toString</P>
<p>Usage Example:</P>
<p>color.toHex(); //返回"#000000"<br/>
color.toString(); //返回"#000000"</P>
<p>dojo.graphics.color.Color.toCss</P>
<p>Usage Example:</P>
<p>color.toCss(); //返回"rgb(0,0,0)"</P>
<p>dojo.graphics.color.Color.blend</P>
<p>混合另一个颜色得到一个新颜色</P>
<p>Usage Example:</P>
<p>color.blend('#ffffff', 1); //返回[255,255,255]<br/>
color.blend('#ffffff', -1); //返回[0,0,0]<br/>
color.blend('#ffffff', 0);
//按1比1混合黑色和白色，返回[127,127,127]<br/>
颜色参数可以为颜色的任意形式，比如数组，字符串等</P>
<p>or</P>
<p>dojo.graphics.color.blend([0,0,0], [255,255,255], 0); //will
return [127,127,127]<br/>
dojo.graphics.color.blend("#000000", "#ffffff", 0); //will return
"#7f7f7f"<br/>
若第一个参数为字符串，则返回值也会返回字符串</P>
<p>dojo.graphics.color.Color.blendHex</P>
<p>Usage Example:</P>
<p>dojo.graphics.color.blendHex("#000000", "#ffffff", 0); //will
return "#7f7f7f"</P>
<p>dojo.graphics.color.extractRGB</P>
<p>将输入转换为RGB数组</P>
<p>dojo.graphics.color.hex2rgb</P>
<p>将输入的字符串转换为RGB数组</P>
<p>dojo.graphics.color.rgb2hex</P>
<p>将输入的RGB数组转换为字符串</P>
<p>dojo.graphics.color.Color.fromArray</P>
<p>Usage Example:</P>
<p>var color =
dojo.graphics.color.Color.fromArray([0,0,0,1.0]);</P>
<p>模块：dojo.uri.Uri</P>
<p>dojo.uri.Uri</P>
<p>专门用来处理URI(统一资源标识符)的类</P>
<p>Usage Example:</P>
<p>uri = (new dojo.uri.Uri("http://myserver/dojo/",
"guide.html")).toString();<br/>
//uri will be "http://myserver/dojo/guide.html"<br/>
uri = (new dojo.uri.Uri("http://myserver/dojo/",
"../guide.html")).toString();<br/>
//uri will be "http://myserver/guide.html"</P>
<p>
RFC规定的URI语法：[scheme:][//authority][path][?query][#fragment]<br/>
authority语法：[user-info@]host[:port]</P>
<p>比如我们定义一个uri</P>
<p>var uri = new
dojo.uri.Uri("http://user:password@myserver:80/dojo/",
"guide.html?page=1#top");</P>
<p>则uri的属性如下：</P>
<p>authority: 服务器名 "user:password@myserver:80"<br/>
fragment: 片断名 "top"<br/>
host: 主机名 "myserver"<br/>
password: 密码 "password"<br/>
path: 路径 "/dojo/guide.html"<br/>
port: 端口 80<br/>
query: 参数 "page=1"<br/>
scheme: 模式 "http"<br/>
uri: 完整的地址
"http://user:password@myserver:80/dojo/guide.html?page=1"<br/>
user: 用户名 "user:" 似乎有点问题，多了一个冒号</P>
<p>
///////////////////////////////////////////////////////////////////////////////////////////</P>
原文:http://daoger.javaeye.com/blog/43245 <br/>
</DIV>
</div>
<div id="Declare">
本文仅为提供更多信息，不代表新浪BLOG同意其观点或描述。如需转载请注明出处。 </div>
<div id="CloseButton">
<table align="right"><tr>
<td><a href="javascript:close();">
<img src="http://blogjs.sinajs.cn/images/read_mode/readModeClose.gif" width="13" height="13" border="0" alt="close" /></a></td>
<td>
<span style="text-align: right;">
<a href="javascript:close();" style="text-decoration: none; font-size: 12px;">关闭阅读模式</a>
</span>
</td>
</tr>
</table>
</div>
</div>
</div>
<script language="javascript" src="http://blogjs.sinajs.cn/js/read_mode/read_mode.js"></script>
<span name="pvcounter" pid="1" key="551fd8e701008c8h" url="http://blog.sina.com.cn/s/blog_551fd8e701008c8h.html" expara="" style="display:none"></span>
<script id="PVCOUNTER_FORIE" type="text/javascript"></script>
<script type="text/javascript" src="http://news.sina.com.cn/pvcounter/pvcounter.js"></script><img src="http://secure-cn.imrworldwide.com/cgi-bin/m?ci=cn-sina2006&cg=0" alt="" /><script type="text/javascript" src="http://sina.wrating.com/a1.js"></script>
<script type="text/javascript">
try{
var vjAcc="860010-0328010000";
var wrUrl="http://sina.wrating.com/";
vjTrack("");
}catch(e){};
</script>
<noscript><img src="http://sina.wrating.com/a.gif?a=&c=860010-0328010000" width="1" height="1"/></noscript></body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -