touch事件（按下显示，松开消失）

来源：互联网发布：c window 编程编辑：程序博客网时间：2024/05/21 10:42

<!DOCTYPE html><html><head>    <meta charset="utf-8"/>    <title></title>    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script></head><body><div style="width:100%;">    <div id="touchArea" style="width:90%; height:200px; background-color:#CCC;font-size:100px">        长按我</div>    <div class="showArea" style="width:90%; height:100px; background-color:red;font-size:100px;display: none"></div></div><script>    var timeOutEvent=0;    $(function(){        $(document).click(function(){            $(".showArea").css("display","none");        })        $("#touchArea").on({            touchstart: function(e){                timeOutEvent = setTimeout("longPress()",500);                e.preventDefault();                return false;            },            touchmove: function(){                clearTimeout(timeOutEvent);                timeOutEvent = 0;            },            touchend: function(e){                clearTimeout(timeOutEvent);                timeOutEvent = ShortLeave();                e.preventDefault();                return false;            }        })    });    function longPress(){        timeOutEvent = 0;        $(".showArea").css("display","block");    }    function ShortLeave(){        timeOutEvent = 0;        $(".showArea").css("display","none");    }</script></body></html>

touch 和 click事件的相关冲突

点击打开链接

问题：有touch 就没有了 click功能，解决方法：去掉e.preventDefault();                return false;

0 0