小程序的长按事件和点击事件
开发小程序的时间，碰见一个需求，就是一个图片，点击的时候，查看大图，长按的时候，出删除图片的模态，写了半天时间，终于是把需求完成了，下面就贴上代码，希望前端的同行小伙伴能用到，直接上代码：
var int;
Page({
/**
* 页面的初始数据
*/
data: {
touchTime:0,
moveIs: false,
intTime:0,
name:""
},
onLoad: function (options) {
this.setData({
name: options.name
})
},
photograph:function(){
wx.chooseImage({
count: 9, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: function (res) {
// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
var tempFilePaths = res.tempFilePaths;
console.log(tempFilePaths)
}
})
},
imgtouchstart:function(e){
console.log(e)
//获取当前点击的这个图片位置
var me=this;
this.setData({
moveIs:true
})
var time = this.data.intTime;
int=setInterval(function(){
time++; //时间自增
me.setData({
intTime:time //时间赋值
})
},100)
// console.log(e.currentTarget.dataset.code)
setTimeout(function(){
var newtouchTime = me.data.touchTime,
moveIs = me.data.moveIs;
if (newtouchTime == 0 && moveIs==true){
// 删除弹窗
wx.showModal({ //这个不用多说，做过小程序都看得懂
title: '提示',
content: '确认删除该图片吗？',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
}
},1000)
},
imgtouchmove:function(e){
var newtouchTime = this.data.touchTime+1; //判断手指有没有移动 如果没有移动就是长按事件
this.setData({
touchTime: newtouchTime //返回值
})
},
imgtouchend:function(e){
clearInterval(int); //暂停
var time = this.data.intTime, //获取时间
code = e.currentTarget.dataset.code;
if (time<=1&& touchTime<=1){ //如果时间短并且没有移动过 那就是长按事件 跳转大图的页面查看
wx.navigateTo({
url: '../lookImg/lookImg?code=' + code //跳转页面，根据code值判断你传的是哪一张图片
})
}
this.setData({ //执行完毕，全部还原
touchTime: 0,
moveIs:false,
intTime:0
})
}
})
有时间可以关注一下我的博客，有时间就会更新一些工作中碰见的问题，有好的意见也希望大家多交流，技术在于讨论中进步：http://www.cnblogs.com/laiqiangjin
