文档手册

Event类

2024-07-07 00:24:28

class Event

properties:

  • event.bubbles

  • event.cancelable

  • event.currentTarget

  • event.defaultPrevented

  • event.eventPhase

  • event.target

  • event.type -“点击”、“鼠标按下”等。

  • event.namespace -事件名称的命名空间部分(点之后)。就像“click.comp”事件中的“comp”。

  • event.data:any

  • event.details:any - event.data 的别名

  • event.keyCode:integer -密钥代码,参见include/sciter-x-key-codes.h

  • event.platformKeyCode -平台的本地密钥代码,例如Windows上WM_KEYDOWN中的wParam。

  • event.code -keyCode的字符串表示 KeyAF1Enter .

  • event.altKey - ALT true/false

  • event.ctrlKey

  • event.metaKey - command key 在OSX上, win 在Windows上

  • event.shiftKey

  • event.isOnIcon -鼠标事件,Sciter特定,如果鼠标在元素图标上则为true- foreground-image 区域,如果它是由CSS定义的。

  • event.button

  • event.buttons

  • currentTarget相对坐标:

    •   event.x :number,CSS pixels

    •   event.y :number,CSS pixels

    • event.position :点,CSS像素

    • event.contentPosition :点,CSS像素: event.position + event.currentTarget.scrollPosition

  • 客户端相对坐标,相对于文档容器(窗口|框架):

    •   event.clientX :number,CSS pixels

    •   event.clientY :number,CSS pixels

    • event.clientPoisition :点,CSS像素

  • 窗口相对坐标:

    •   event.windowX :number,CSS pixels

    •   event.windowY :number,CSS pixels

    • event.windowPoisition :点,CSS像素

  • 屏幕相对坐标,相对于整个桌面:

    • event.screenX :数字,屏幕像素

    • event.screenY :数字,屏幕像素

    • event.screenPosition :点,屏幕像素

  • 滚动(例如鼠标滚轮)增量:

    •   event.deltaX :编号

    •   event.deltaY :编号

    •   event.delta :尺寸

  • event.deltaMode|int - 0 - deltaX/Y是来自触摸设备的像素,1 - deltaX/Y是在 lines 中(也称为鼠标滚轮 ticks )。

  • event.relatedTarget -仅适用于模糊|重点|focusin| focusout事件,参见:relatedTarget。

特性(Sciter特定):

  • event.x - sciter特定,坐标是相对的

  • event.y -到 event.currentTarget -此事件处理程序附加到的元素。

  • event.source -在某些事件中用于表示辅助 source 元素。

  • event.isOnIcon:Element -鼠标事件,当鼠标在该元素的图标上时,它被设置为元素。元素图标是元素的前景图像(如果有的话),所以当鼠标在图像渲染的区域上时,event.isOnIcon打开。

  • event.reason -整数,事件类型特定标志。

属性(Sciter特定,手势):

  • event.delta: 调整平移手势增量的大小,以逻辑(CSS)像素为单位;

  • event.deltaZoom:float 缩放手势增量缩放倍数: currentScale *= evt.deltaZoom ;

  • event.deltaRotation:Angle 缩放手势增量角度: currentRotation += evt.deltaRotation ;

 方法:

  • event.preventDefault()

  • event.stopImmediatePropagation()

  • event.stopPropagation()

 静态方法:

  • Event.keyState(key:string): true|false|undefined

    返回按键的按下状态。例如:

     if(Event.keyState(`CapsLock`))
    ... CAPS LOCK is on ...

 已知事件

 鼠标

 名称 别名 描述
mousemovemouse-move
mouseentermouse-enter
mouseleavemouse-leave
mouseovermouse-over关于mosueenter和mouseover之间的区别,请参见MDN
mouseoutmouse-out关于mosueleave和mouseout之间的区别,请参见MDN
mouseidlemouse-idle鼠标在元素中保持不移动,该事件触发工具提示显示。
mousetickmouse-tick鼠标按下一段时间的元素,周期性的“脉冲”事件。
mousedownmouse-down
mouseupmouse-up
wheelmouse-wheel
mousedragrequestmouse-drag-request按下的鼠标在系统定义的阈值后开始移动
dblclickdouble-click
tripleclicktriple-click

 行为

 名称 别名 描述
click

press
鼠标按下可点击元素
input
发布的事件,在用户更改某些内容后到达。
change
同步事件,在用户更改时和屏幕更新之前到达。
changing
更改前,在文本编辑器中
submit
 在 <form>
reset
 在 <form>
expand
某个元素被展开(打开)的通知,例如 option in `
collapse
某些元素被折叠(关闭)的通知,例如 option in `
statechangestate-changeUI状态更改,例如,插入符号被用户移动,拆分器在框架集中移动等。
currentstatechangecurrent-state-change:当前状态更改(选择,菜单)。
disabledstatechangedisabled-state-change
readonlystatechangereadonly-state-change
navigation该事件是响应于点击超链接而生成的。 event.data 是一个对象 { url:string, target:string } 。在接收阶段使用此事件将防止默认将目标文档加载到窗口或框架中。
contextmenucontext-menu元素的上下文菜单请求
contextmenusetupcontext-menu-setup设置上下文菜单的通知,上下文菜单DO<元素是事件.源
animationendanimation-end
animationstartanimation-start
animationloopanimation-loop
transitionendtransition-end
transitionstarttransition-start
mediachangemedia-change仅当媒体变量发生变化时,事件才会发送到窗口
contentchangecontent-changeDOM更改通知:添加或删除元素,更改属性
inputlangchangeinput-lang-change用户已切换输入语言
pastehtmlpaste-html由behavior:richtext从剪贴板粘贴HTML时发送
pastetextpaste-text由behavior:richtext从剪贴板粘贴纯文本时发送
pasteimagepaste-image由behavior发送:从剪贴板粘贴图像时的richtext
popuprequestpopup-request参见弹出生命周期事件
popupreadypopupready参见弹出生命周期事件
popupdismissingpopup-dismissing参见弹出生命周期事件
popupdismissedpopup-dismissed参见弹出生命周期事件
tooltiprequesttooltip-request参见弹出生命周期事件

 重点

 名称 别名 描述
focusinfocus-in当焦点移动到容器中的子对象时,将其发送到容器
focusoutfocus-out当焦点移动到容器外时发送到容器
focus

blur

 键盘

 名称 别名 描述
keydownkey-down 按下键盘键
keyupkey-up 按下键盘键
keypresskey-char按下并按下键盘键,键代码被转换为产生 event.char
compositionstartcomposition-start IME合成已开始
compositionendcomposition-end 输入法合成结束

 滚动

 名称 别名 描述
scroll
在可滚动元素的滚动位置改变后,
scrollanimationstartscroll-animation-start在滚动动画开始时发送到可滚动元素
scrollanimationendscroll-animation-end在滚动动画结束时发送到可滚动元素
scrollstepplusscroll-step-plus点击滚动条的一部分
scrollstepminusscroll-step-minus点击滚动条的一部分
scrollpageplusscroll-page-plus点击滚动条的一部分
scrollpageminusscroll-page-minus点击滚动条的一部分
scrollsliderpressscroll-slider-press 按下滚动滑块
scrollsliderreleasescroll-slider-release 滚动滑块已释放

 手势

来自触摸设备的事件集-触摸板/触控板或触摸屏。

 名称 别名 描述
gesturestartgesture-start参见手势处理启动
gestureendgesture-end在最后的触摸接触被移除之后发送事件。
gesturepressgesture-press当触摸该元素时发送该事件。例如,Android在此类事件上显示扩展圆圈动画。
gesturepinchgesture-pinch 单击
gesturepangesture-pan平移(滚动)手势事件。
gestureswipegesture-swipe滑动(快速平移)手势事件。

 手势处理

对于要接收手势事件的元素,它应处理手势开始事件。当进行第一次触摸接触时发送事件。

接收此事件的元素可以调用 element.state.wantsGestures(...) 方法来定义它想要接收的手势。

element.state.wantsGestures(event1,event2,...) 接受元素想要接收的手势事件列表:

  •   "pan-vertical" -垂直滚动

  •   "pan-horizontal" -水平滚动

  • "zoom"

  • "rotation"

谨慎

element.state.wantsGestures() 方法只能在 gesture-start 事件处理程序中调用。

尖端

如果请求“旋转”手势,则使用手势捏处理程序中的event.deltaRotation来获取增量角度。

如果请求“缩放”手势,则使用手势捏处理程序中的event.deltaZoom来获取增量缩放。

文档生命周期事件

 加载:

 名称 别名 描述
parseddocument-parsed文档刚得到一个DOM结构,脚本还没有运行。此事件只能由文档容器(窗口或框架)处理。
DOMContentLoadeddocument-ready文档加载,DOM解析,脚本加载和运行。
completedocument-complete文档完全加载,脚本运行,HTML中定义的所有资源完成加载(成功或失败)。

 闭幕式:

 名称 别名 描述
closerequestdocument-unload-request在文档关闭的第一阶段,此时可以通过调用 event.preventDefault() 来拒绝它。
beforeunloaddocument-before-unload文档即将被卸载,脚本命名空间仍在运行。
unloaddocument-unload文档已关闭,即将删除。

 元素的状态变化

注意

这些不是冒泡事件-只传递给元素本身。

 名称 别名 描述
sizechangesize-change检测到元素尺寸变化
visualstatechangevisibility-state-change元素变得可见或不可见,例如由于可见性值更改。 event.reason 是真实的,如果它变得可见。

 图像

 名称 别名 描述
loadimage-load 图像已加载
errorimage-error 出现映像加载错误

 寻呼机(打印预览)

<frame|pager> (打印预览)相关事件

 名称 别名 描述
paginationstartpagination-start已在帧/寻呼机上启动分页
paginationpagepagination-page一页分页完成
paginationendpagination-ended分页已结束

 拖放

系统拖放事件:

 名称 别名 描述
drag
D&D光标移动到元素上
dragenterdrag-enterD&D光标进入元素
dragleavedrag-leaveD&D光标离开元素
drop
用户通过释放主鼠标按钮删除数据
dragcanceldrag-cancel用户通过按ESC键取消D&D操作。
willacceptdropwill-accept-drop 见下文

 接受拖放

对于一个元素,为了接受来自系统的D&D的drop,它应该处理will-accept-drop事件,如果event.detail包含可接受的数据,则通过调用 event.stopPropagation() 来消耗该事件

在D&D events中,event.detail是一个具有以下字段的对象

  • dataType -字符串,主要格式,“text”、“html”、“file”或“json”之一。

  • 数据对象,可以包含一个或多个字段:

    • text: string -纯文本数据;

    • html: string - HTML数据;

    • file : [path1,path2,...] | path0 -单个或多个文件名;

    • json :any -任何可以被JSON.stringify'ed艾德的数据;

 启动拖放

调用窗口.performDrag(.)启动D&D行动

event.detail = { dataType: ...; data: {} }

 视频

  <video> 相关事件

 名称 别名 描述
videoreadyvideo-ready
videostartvideo-start
videostopvideo-stop
videocoordinatevideo-coordinate
videoframereadyvideo-frame-ready

MISC