jquery - 是否可以在 jQuery 中嵌套事件监听器
问题描述
一旦“过渡”结束,我正在使用“过渡结束”来运行进一步的代码。
我尝试嵌套事件侦听器没有成功,因此我可以在初始转换完成后观看进一步的转换。
从下面的代码中可以看出,我一直在测试,试图先停止冒泡并删除以前的事件侦听器,但没有任何成功。
在下文中,第一个偶数侦听器工作,然后第二个之后的任何东西都不会运行。
任何关于我做错了什么的指导,将不胜感激。
$('.image-viewer').addClass('animate animate-out').on("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
e.stopPropagation();
if ( e.originalEvent.propertyName === 'opacity' ) {
$('.image-viewer').removeClass('animate animate-out').off("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd");
$('.image-viewer').addClass('transition').on("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
e.stopPropagation();
if ( e.originalEvent.propertyName === 'opacity' ) {
$('.image-viewer').off("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd");
}
});
}
});
解决方案
由于您嵌套了相同的事件,您可以设置一个全局侦听器:
$(document).on( "transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", '.image-viewer, function(){
if ( e.originalEvent.propertyName === 'opacity' ) {
$('.image-viewer').off();
}
} );
推荐阅读
- sql - SQL 仅选择最后一行的用户名
- flutter - Riverpod - 合并提供商时出现问题
- typescript - 如何将区分联合转换为 DU,其中每个案例都是初始 DU 案例的数组
- html - 在移动设备中将滚动方向修改为水平
- java - 找不到适合 jdbc:mysql://localhost::3306/gestionpersonnel?serverTimezone=UTC 的驱动程序
- ios - 使用 SwiftUI 的 ReplayKit 广播上传扩展
- javascript - 如何每隔一秒调用一次函数异步等待?
- javascript - 如何使用 Async/await 将获取的 JSON 数据正确显示到 DOM
- html - 确保 figcaption 宽度永远不会超过图像宽度
- python - 存在 GPU 时如何分析整个 pytorch 代码?