一、事件
1、代码示例:
<!— .ksml —>
<button id="btnTest" data—hi="helloKS" bindtap="clickMe">Click me!</button>
// .js
Page({
clickMe: function(event) {
this.setData(event)
}
})
2、冒泡事件:当一个组件上的事件被触发后,该事件会向父节点传递。
3、非冒泡事件:当一个组件上的事件被触发后,该事件不会向父节点传递。
KSML 的冒泡事件列表:
类型 | 触发条件 |
touchstart | 手指触摸动作开始 |
touchmove | 手指触摸后移动 |
touchcancel | 手指触摸动作被打断,如来电提醒,弹窗 |
touchend | 手指触摸动作结束 |
tap | 手指触摸后马上离开 |
longpress | 手指触摸后,超过 350ms 再离开 |
longtap | 手指触摸后,超过 350ms 再离开(推荐使用 longpress 事件代替) |
transitionend | 会在 CSS transition 或 ks.createAnimation 动画结束后触发 |
animationstart | 会在一个 CSS animation 动画开始时触发 |
animationiteration | 会在一个 CSS animation 一次迭代结束时触发 |
animationend | 会在一个 CSS animation 动画完成时触发 |
注:除上表之外的其他组件自定义事件如无特殊声明都是非冒泡事件
4、阻止事件冒泡
使用catchtap可以阻止冒泡
<view id="outer" bindtap="handleTap1">
outer view
<view id="middle" catchtap="handleTap2">
middle view
<view id="inner" bindtap="handleTap3">
inner view
</view>
</view>
</view>
5、事件的捕获阶段
可以采用capture—bind、capture—catch关键字,后者将中断捕获阶段和取消冒泡阶段。
6、互斥事件绑定
使用 mut—bind,只会有一个绑定mut—bind函数被触发。同时,它完全不影响 bind 和 catch 的绑定效果。
7、事件对象
如无特殊说明,当组件触发事件时,逻辑层绑定该事件的处理函数会收到一个事件对象。
8、BaseEvent 基础事件对象属性列表
属性 | 类型 | 说明 |
type | String | 事件类型 |
timeStamp | Integer | 事件生成时的时间戳 |
target | Object | 触发事件的组件的一些属性值集合 |
currentTarget | Object | 当前组件的一些属性值集合 |
mark | Object | 事件标记数据 |
9、CustomEvent 自定义事件对象属性列表(继承 BaseEvent)
属性 | 类型 | 说明 |
detail | Object | 额外的信息 |
10、TouchEvent 触摸事件对象属性列表(继承 BaseEvent)
属性 | 类型 | 说明 |
touches | Array | 触摸事件,当前停留在屏幕中的触摸点信息的数组 |
changedTouches | Array | 触摸事件,当前变化的触摸点信息的数组 |
特殊事件: canvas 中的触摸事件不可冒泡,所以没有 currentTarget。
type:代表事件的类型
timeStamp:页面打开到触发事件所经过的毫秒数
target:触发事件的源组件
属性 | 类型 | 说明 |
id | String | 事件源组件的 id |
dataset | Object | 事件源组件上由 data开头的自定义属性组成的集合 |
currentTarget:事件绑定的当前组件
属性 | 类型 | 说明 |
id | String | 当前组件的 id |
dataset | Object | 当前组件上由 data开头的自定义属性组成的集合 |
dataset:在组件节点中可以附加一些自定义数据。这样,在事件中可以获取这些自定义的节点数据,用于事件的逻辑处理。在 KSML 中,这些自定义数据以 data开头,多个单词由连字符—连接。这种写法中,连字符写法会转换成驼峰写法,而大写字符会自动转成小写字符。
mark:使用 mark 来识别具体触发事件的 target 节点。此外, mark 还可以用于承载一些自定义数据(类似于 dataset )。当事件触发时,事件冒泡路径上所有的 mark 会被合并,并返回给事件回调函数。(即使事件不是冒泡事件,也会 mark 。)

在上述 KSML 中,如果按钮被点击,将触发 bindViewTap 和 bindButtonTap 两个事件,事件携带的 event.mark 将包含 myMark 和 anotherMark 两项。
mark 和 dataset 很相似,主要区别在于,mark 会包含从触发事件的节点到根节点上所有的 mark: 属性值;而 dataset 仅包含一个节点的 data属性值。 细节注意事项,如果存在同名的 mark ,父节点的 mark 会被子节点覆盖。 在自定义组件中接收事件时, mark 不包含自定义组件外的节点的 mark 。 不同于 dataset ,节点的 mark 不会做连字符和大小写转换。
touches
属性 | 类型 | 说明 |
identifier | Number | 触摸点的标识符 |
pageX, pageY | Number | 距离文档左上角的距离,文档的左上角为原点 ,横向为 X 轴,纵向为 Y 轴 |
clientX, clientY | Number | 距离页面可显示区域(屏幕除去导航条)左上角距离,横向为 X 轴,纵向为 Y 轴 |
CanvasTouch 对象
属性 | 类型 | 说明 |
identifier | Number | 触摸点的标识符 |
x, y | Number | 距离 Canvas 左上角的距离,Canvas 的左上角为原点 ,横向为 X 轴,纵向为 Y 轴 |
changedTouches
数据格式同 touches, 表示有变化的触摸点,如从无变有(touchstart),位置变化(touchmove),从有变无(touchend、touchcancel)。
detail
自定义事件所携带的数据,如表单组件的提交事件会携带用户的输入,媒体的错误事件会携带错误信息,详见组件定义中各个事件的定义。
点击事件的 detail 带有的 x, y 同 pageX, pageY 代表距离文档左上角的距离。
二、页面栈
框架以栈的形式维护了当前的所有页面。 当发生路由切换的时候,页面栈的表现如下:
路由方式 | 页面栈表现 |
初始化 | 新页面入栈 |
打开新页面 | 新页面入栈 |
页面重定向 | 当前页面出栈,新页面入栈 |
页面返回 | 页面不断出栈,直到目标返回页 |
Tab 切换 | 页面全部出栈,只留下新的 Tab 页面 |
重加载 | 页面全部出栈,只留下新的页面 |
开发者可以使用 getCurrentPages() 函数获取当前页面栈。
快手广告作为国内知名的短视频app,快手短视频的用户主要集中在手机端。快手有着海量的用户,强大的服务器后台,所以它能够带来的流量也是相当可观的,现在很多人投放快手广告都找北京巨宣网络广告有限公司,目前在他家开户的速度是非常快的,后期还可以提供代运营服务等等,咨询电话4009602809!~~
- 2026-03-27
快手广告 | 一键拆解爆款素材基因 - 2026-03-24
快手广告|商家38上新季生意爆发,多维拆解… - 2026-03-24
快手磁力引擎广告 | 对谈36氪,AI下凡驱动… - 2026-03-17
快手品牌广告如何代投实现GMV倍增? - 2026-03-16
快手广告功能更新 | 活动复盘大场活动 - 2026-03-16
快手广告丨磁力方舟「人群智能推荐」+「AI… - 2026-03-11
快手磁力方舟广告平台【AI智能复盘】,全新… - 2026-03-07
2026年快手广告短剧行业春节档营销新趋势 - 2026-03-04
快手磁力引擎广告2026体育营销招商手册上新… - 2026-03-03
快手商业私信广告案例库(10)




















管理员
该内容暂无评论