zepto.js双击事件及双击DIV时不要选中文字

warning: 这篇文章距离上次修改已过450天,其中的内容可能已经有所变动。

一个小项目中使用到了zepto库,前端想实现双击div触发事件,开始用的是doubleTap,移动端可以实现双击点击,但是PC端却没反应。试了jquery的dbclick没生效,google找了很久没找到。

后来在zepto.js源码中搜索click,找到了dblclick,直接测试,成功!

           /*
           $('.status-bar').doubleTap(() => {
                             
                $.toptip('doubleTap','success')
            });
            */

            $('.status-bar').dblclick(() => {
                $.toptip('doubleclick', 'warning')
            });

另外,还遇到了个问题,div里包含文字,双击时会首先选中文字,导致双击没触发事件,可以在div上加个样式解决。

.report .status-bar {
    user-select: none;
    /* standard syntax */
    -webkit-user-select: none;
    /* webkit (safari, chrome) browsers */
    -moz-user-select: none;
    /* mozilla browsers */
    -khtml-user-select: none;
    /* webkit (konqueror) browsers */
    -ms-user-select: none;
    /* IE10+ */

}
none
最后修改于:2023年08月31日 11:35

评论已关闭