收藏
收藏
收藏
APICloud官方在1.1.60版本中添加了长按监听方法,但是真的仅仅是监听到了长按的操作，不能实时获取到长按的位置，长按的元素，所以用了之前找到的一个方法，使用JS代码获取值，使用longpress监听方法调用JS函数，代码贴下
首先要在页面加载时初始化监听和声明一个要用到的全局变量：
var Htmls = "";
apiready = function() {
api.addEventListener({
name:'longpress'
},function(ret,err){
if(Htmls != "")
{
alert(Htmls);
Htmls = "";
}
});
}
复制代码
接下来是获取值的代码（这里用HTML代码做示例）：
var timeOutEvent = 0;
//定时器
//开始按
function gtouchstart(obj) {
Htmls = $(obj).html();
timeOutEvent = setTimeout(function(){
alert("清除了");//因为页面弹动会导致元素一直处于按住的状态，所以超过700毫秒自动清空变量，避免点击其他元素触发事件
Htmls = "";
}, 700);
return false;
};
//手释放，取消长按事件
function gtouchend() {
clearTimeout(timeOutEvent);
Htmls = "";
};
//如果手指有移动，则取消所有事件，此时说明用户只是要移动而不是长按
function gtouchmove() {
clearTimeout(timeOutEvent);
Htmls = "";
};
复制代码
最后的元素事件代码：
ontouchstart="gtouchstart(this)"
ontouchmove="gtouchmove()"
ontouchend="gtouchend()"
复制代码
整体的源代码在这：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<title>title</title>
<link rel="stylesheet" type="text/css" href="../css/api.css"/>
<style>
body{
}
</style>
</head>
<body>
<a ontouchstart="gtouchstart(this)" ontouchmove="gtouchmove()" ontouchend="gtouchend()">长按我（1）</a></br>
<a ontouchstart="gtouchstart(this)" ontouchmove="gtouchmove()" ontouchend="gtouchend()">长按我（2）</a></br>
<a ontouchstart="gtouchstart(this)" ontouchmove="gtouchmove()" ontouchend="gtouchend()">长按我（3）</a></br>
<a ontouchstart="gtouchstart(this)" ontouchmove="gtouchmove()" ontouchend="gtouchend()">长按我（4）</a>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/jquery-1.10.2.js"></script>
<script type="text/javascript">
var Htmls = "";
apiready = function() {
api.addEventListener({
name:'longpress'
},function(ret,err){
if(Htmls != "")
{
alert(Htmls);
Htmls = "";
}
});
}
var timeOutEvent = 0;
//开始按
function gtouchstart(obj) {
Htmls = $(obj).html();
timeOutEvent = setTimeout(function(){
alert("清除了");//因为页面弹动会导致元素一直处于按住的状态，所以超过700毫秒自动清空变量，避免点击其他元素触发事件
Htmls = "";
}, 700);
return false;
};
//手释放，取消长按事件
function gtouchend() {
clearTimeout(timeOutEvent);
Htmls = "";
};
//如果手指有移动，则取消所有事件，此时说明用户只是要移动而不是长按
function gtouchmove() {
clearTimeout(timeOutEvent);
Htmls = "";
};
</script>
</html>
复制代码
Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
![ThinkPHP5实战之[教学管理系统]](https://img.php.cn/upload/course/000/000/068/6253d87459486427.png)
