html页面添加长按事件
作者:互联网
记录是为了更好的成长!
<view class="money"> <text class="pic_bg" @click="checkValue(item.value)" v-for="item in price" :key="item.text" @touchstart="gtouchstart()" @touchmove="gtouchmove()" @touchend="gtouchend(item.value)">{{ item.text }}</text> </view>
<script> //import { Picker } from 'vux' export default { /*components: { Picker },*/ data() { return { timeOutEvent: 0 //定时器 } }, mounted() { }, methods: { //开始按 gtouchstart(){ this.timeOutEvent = setTimeout(this.longPress(),500);//这里设置定时器,定义长按500毫秒触发长按事件,时间可以自己改 return false; }, //手释放,如果在500毫秒内就释放,则取消长按事件,此时可以执行onclick应该执行的事件 gtouchend(text){ clearTimeout(this.timeOutEvent);//清除定时器 if(this.timeOutEvent!=0){ //这里写要执行的内容( this.value = text; this.buttonDisabled = false; } return false; }, //如果手指有移动,则取消所有事件,此时说明用户只是要移动而不是长按 gtouchmove(){ clearTimeout(this.timeOutEvent);//清除定时器 this.timeOutEvent = 0; }, //真正长按后应该执行的内容 longPress(){ this.timeOutEvent = 0; } }, } </script>
以上内容代表个人观点,仅供参考,不喜勿喷。。。
标签:定时器,false,text,html,timeOutEvent,return,添加,500,页面 来源: https://www.cnblogs.com/newbest/p/11215417.html