JS 判断鼠标长按

最新推荐文章于 2024-04-01 16:39:47 发布
最新推荐文章于 2024-04-01 16:39:47 发布
阅读量533 收藏
点赞数 1
文章标签： html javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_53901860/article/details/130490917
版权 
<!DOCTYPE HTML>
<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>鼠标长按</title> 
    </head>
    <body>
        <input type="button" οnmοusedοwn="holdDown()" οnmοuseup="holdUp()" value="鼠标长按"/>
        <script type="text/javascript">  
            var timeStart,timeEnd,time;//申明全局变量
            
            function getTimeNow()//获取此刻时间
            {
                var now=new Date();
                return now.getTime();
            }
            function holdDown()//鼠标按下时触发
            {
                timeStart=getTimeNow();//获取鼠标按下时的时间
                time=setInterval(function()//setInterval会每100毫秒执行一次
                {
                    timeEnd=getTimeNow();//也就是每100毫秒获取一次时间
                    if(timeEnd-timeStart>1000)//如果此时检测到的时间与第一次获取的时间差有1000毫秒
                    {
                        clearInterval(time);//便不再继续重复此函数 （clearInterval取消周期性执行）
            　　　     alert("长按");//并弹出代码
                    }
                },100);
            }
            function holdUp()
            {
                clearInterval(time);//如果按下时间不到1000毫秒便弹起，
            }
        </script> 
    </body>
</html>

君子不卿
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JS判断是否长按某一键的方法
10-22
主要介绍了JS判断是否长按某一键的方法,涉及JavaScript针对键盘按键的判断及响应操作技巧,需要的朋友可以参考下
JS 判断鼠标长按 实例
weixin_34006468的博客
08-03 682
为什么80%的码农都做不了架构师？>>> ...
JavaScript-长按及鼠标事件
热门推荐
火星男孩的分享空间
03-09 1万+
一、判断鼠标左右键：<html> <head> <title>js判断鼠标左、中、右键哪个被点击</title> <script type="text/javascript"> function whichButton(event) { var btnNum = event.button; console.log("eve
使用js实现长按监听
qq_61233877的博客
05-19 4607
使用js实现长按监听
JavaScript长按鼠标左键弹出快捷菜单效果代码
05-19
为了实现长按效果，我们还需要一个定时器来判断鼠标按键是否被持续按下一定时间。例如，如果用户按下鼠标超过250毫秒，我们可以认为这是一个长按操作，此时可以显示快捷菜单。 以下是实现这个效果的步骤： 1. **...
jQ长按鼠标左键弹出菜单特效代码
03-20
通过设置一个计时器，我们可以在`mousedown`事件发生后等待一定时间（例如300毫秒），如果在这段时间内没有接收到`mouseup`事件，就可以判断用户是在长按，此时可以执行弹出菜单的逻辑。 以下是一个简单的实现步骤...
jQ长按鼠标左键弹出菜单.zip
07-04
在这个实例中，jQuery用于监听鼠标的mousedown和mouseup事件，以及计算按下和释放鼠标之间的时间差，以判断是否满足“长按”的条件。通常，长按时间阈值可设置为300毫秒至1秒，具体值可以根据实际需求进行调整。 ...
HTML5 Canvas实现的鼠标点击长按粒子动画特效源码.zip
11-03
通过调整鼠标按下和释放的时间差，可以判断是否为长按操作。 8. **性能优化**：由于Canvas上的绘图操作相对耗性能，开发者可能采用了各种优化技巧，比如缓存不常改变的图形、减少不必要的重绘区域，或者使用`...
h5长按短按双击模块化
02-16
模块化可以提高代码的可读性、可维护性和复用性，常见的模块化解决方案有CommonJS（Node.js）、ES6的import/export语法以及AMD（Asynchronous Module Definition）如RequireJS。 4. **响应式设计**： - h5通常意味...
Unity实现鼠标双击与长按的检测
08-25
主要为大家详细介绍了Unity实现鼠标双击与长按的检测，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
js判断是否长按某按键
supersoulsoul
05-05 2520
onkeydown="TestKeyDown(event);" //判断是否长按某按键 varlastkeyCode =-1; functionTestKeyDown(event) { if(event.keyCode ==lastkeyCode) { //长按的处理 } lastkeyCode =event.keyCode; } ...
原生js实现鼠标长按事件
TianXuab的博客
06-28 1639
【代码】原生js实现鼠标长按事件。
jQuery监听鼠标长按事件---定时器
qq_38844623的博客
05-08 355
<script> let timeout;//用于存储定时器的变量 // #moveLeft 表示需要监听长按事件的元素 $("#moveLeft").mousedown(function() { timeout= setTimeout(function() { alert(2)// 在这里做长按需要的操作 }, 500);// 鼠标按下0.5秒后发生alert事件 }); $("#moveLeft")
JS 中实现鼠标长按连续触发
UserGuan的博客
07-29 1822
【代码】JS 中实现鼠标长按连续触发。
鼠标单击和长按事件
m0_66911948的博客
07-31 394
鼠标单击触发事件效果，单击结束触发结束效果。鼠标长按触发不间断的事件效果，长按结束触发结束效果。
Unity中鼠标的双击与长按的检测
weixin_45493023的博客
02-12 6555
Unity中鼠标的双击与长按的检测 在unity中，我们会遇到很多的关于鼠标的事件。虽然unity中给出了相关的点击与拖拽方法，可是这些方法只对UI和碰撞体适用。那么，如何直接用代码实现鼠标的双击与长按的检测呢？ 首先我们需要几个变量，用来保存时间，以判断是长按还是点击。 private float main_time; private float click_time; private flo...
自动化测试工具---SikuliX学习笔记（一）模拟鼠标长按按键的功能
最新发布
weixin_45222909的博客
04-01 346
SikuliX
检测鼠标是否双击_unity中的双击按钮检测和长按按钮的检测
weixin_39723102的博客
12-15 1047
前言今天使用UGUI的知识来实现一下 按钮的双击和按钮长按的检测其实我们的思路就是 每次按下检测按下时间 如果长按时间超过某一特定的值那么我们判定 长按至于双击的检测 我们是 当第一次按下之后抬起 开始计时 在特定值之前我们如果检测到按下第二次我们判定双击按钮using UnityEngine; using UnityEngine.Events; using UnityEngine.EventSy...
vue鼠标长按左键框选插件
07-12
您可以尝试使用`vue-drag-select`插件来实现鼠标长按左键框选的功能。该插件可以在 Vue 中方便地实现框选功能，以下是使用步骤： 1. 安装插件： ```bash npm install vue-drag-select ``` 2. 在您的 Vue 组件中引入该插件： ```javascript import Vue from 'vue'; import VueDragSelect from 'vue-drag-select'; Vue.use(VueDragSelect); ``` 3. 在模板中使用插件： ```html <template> <div> <vue-drag-select @selection="handleSelection"> <!-- 在这里放置需要框选的元素 --> </vue-drag-select> </div> </template> ``` 4. 在组件中定义 `handleSelection` 方法来处理框选事件： ```javascript methods: { handleSelection(selection) { // selection 是框选的结果，包含选中的元素等信息 console.log(selection); }, }, ``` 通过以上步骤，您就可以在 Vue 中使用 `vue-drag-select` 插件来实现鼠标长按左键框选功能了。请注意根据插件文档进行更详细的配置和使用。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值