加载中…
个人资料
  • 博客等级:
  • 博客积分:
  • 博客访问:
  • 关注人气:
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
正文 字体大小:

[jQuery]鼠标按住不放触发事件

(2011-10-27 16:33:06)
标签:

鼠标

代码

处理

触发

运行

it

分类: Computer

前提:

在JavaScript(JQuery)中没有,mouseup,mousedown,并没有mousedownforamoment,要如何处理呢?

 

思路分析:

1,按住不放,就是按下,并没有立刻弹起.


2,[假设按下1s,有效]在mousedown方法下,我们编写处理代码,但是要让他在1s后运行.对,setTimeout.


3,这是还有一个问题,点击也会触发.这时我们需要在mouseup方法处理.当鼠标弹起时,我们判断此时setTimeout是否被运行,如果被运行,那说明mousedown超过一分钟,就不做任何处理.否则,说明没有按住鼠标一定时间[超过1s],则终止mousedown的方法,既是终止setTimeout.故,clearTimeout.

 

 

附上完整版HTML代码:
[code=html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
    <title></title>

     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>

    <script>
        $(document).ready(function() {
            $("input").mousedown(function() {
                var flag = false;
                var stop;
                stop = setTimeout(function() {//down 1s,才运行。
                    flag = true;
                    alert("开始处理你的代码.");
                }, 1000);
                $("input").mouseup(function() {//鼠标up时,判断down了多久,不足一秒,不执行down的代码。
                    if (!flag) {
                        clearTimeout(stop);
                    }
                });
            });

        });
    </script>

</head>
<body>
    <input value="按住我1秒钟才行" />
</body>
</html>

[/code]

0

阅读 收藏 喜欢 打印举报/Report
  

新浪BLOG意见反馈留言板 欢迎批评指正

新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 产品答疑

新浪公司 版权所有