|
|
在HTML浏览器中，
一般点击元素等交互事件会首先由外层节点向内层目标节点传递 - 这是捕获（sinking）过程，
然后再返过来由内层目标节点向外层节点传递 - 这是冒泡（ bubbling ) 过程
这里的捕获、冒泡是相对于HTML源码里元素位置的概念。
例如 上面的 input 元素在屏幕上他是显示在最前面，而在HTML源码中，他是在最里面，HTML根节点才是在最外面
所有浏览器引擎都支持事件冒泡, IE11以下不支持事件捕获（ 也就是不支持W3C标准的函数 addEventListener ）
默认情况下，事件使用冒泡事件流(所有浏览器引擎都支持)，不使用捕获事件流。
HTMLayout也一样，默认所有的事件都是在冒泡过程中处理，包括所有内置的默认事件。
例如点击一个超链接，会在冒泡过程中默认触发内置的 onHyperlinkClick 事件以打开超链接，如果希望自定义这个事件，调用其他浏览器打开一个超链接并且阻止默认的事件，那么就要在捕获过程中拦截onHyperlinkClick 事件（ 因为 捕获过程 早于 冒泡传递过程 ).
在aardio中，将事件写在 sinking 表中就是在 捕获过程中触发，示例：
import win.ui;
/*DSG{{*/
var winform = ..win.form(text="HTMLayout事件流";right=599;bottom=399)
winform.add()
/*}}*/
import web.layout;
wbLayout = web.layout( winform );
import process;
wbLayout.sinking = {
onHyperlinkClick = function (ltTarget,ltOwner,reason,behaviorParams) {
process.execute( ltTarget.href );
return true;//阻止事件流继续传递
}
}
wbLayout.html = /**
<!doctype html>
<html>
<head>
<style type="text/css">
html,body{ height:100%; margin:0; }
</style>
</head>
<body>
<a href="http://bbs.aardio.com">http://bbs.aardio.com</a>
</body>
</html>
**/
winform.show();
win.loopMessage();
文本框得到焦点（onFocusGot）、失去焦点（ onFocusLost ） 也是被默认的behavior处理并阻止传递了，
所以也需要在捕获过程中处理，主要代码如下：wbLayout.sinking = {
onFocusGot = function (ltTarget,ltOwner,focusParams) {
}
onFocusLost = function (ltTarget,ltOwner,focusParams) {
}
}
相关帖子：sinking.onFormSubmit 阻止表单默认提交
wbLayout.sinking = {
onFormSubmit = function (ltTarget,ltOwner,reason,behaviorParams) {
console.log(ltOwner.getElementById("login").value );
return true;
}
}
相关帖子：sinking.onKeyDown 处理文本框左右方向键wbLayout.sinking = {
onKeyDown = function (ltTarget,ltEle,keyCode, altState, ltKeyParams) {
if( keyCode == 0x25/*_VK_LEFT*/ ){
}
}
}
|
|
发表于 2014-12-9 12:08:54
