点击事件是页面跳转 当点击事件是页面跳转时，不太适合显示加载框，但小程序的页面跳转并不是很快，如果不作处理又会导致用户反复点击打开多个页面，这里可以使用限制按钮或控件的点击间隔的方式处理，同样可以将这个方法放到公共的代码里面比如util，然后在使用时直接调用即可。
function buttonClicked(self) { self.setData({
buttonClicked: true
})
setTimeout(function () { self.setData({
buttonClicked: false
})
}, 500)
}首先需要在页面对应的js文件里面增加一个buttonClicked数据对象，然后在点击事件里面调用上述方法。
Page({
data: {
buttonClicked: false
},
click: function (e) {
util.buttonClicked(this); var id = e.currentTarget.dataset.id;
wx.navigateTo({
url: '../detail/detail?id=' + id
})
},
})另外，在wxml的点击控件中通过buttonClicked判断是否可以点击，可以用bindtap也可以用disabled
<view bindtap="{{!buttonClicked?'click':''}}" data-id="{{id}}" />
<button bindtap="{{!buttonClicked?'click':''}}" data-id="{{id}}" />
<button bindtap="click" disabled="buttonClicked" data-id="{{id}}" />更新一下
————————————————————————————
关于快速点击时重复打开页面的解决方案
可以通过css的pointer-events:none来解决。
在app.wxss增加以下内容：
/*
* 如果添加了hover-class属性，
* 在点击时会添加hover-class，并维持400ms后移除
*【注意：对于如果超过400ms仍未跳转的事件不起作用】
* 给这些hover类增加穿透属性，可防止重复点击问题
* 其中xxx-hover为自定义的hover类
*/
.navigator-hover, .xxx-hover {
pointer-events: none; // 点击事件直接穿透到下层元素，即跳过这个链接或者按钮
}
WXML页面上例子：
自定义事件：
<view class='field' hover-class='navigator-hover' hover-stay-time='默认400，可自行更改' bindtap='test'></view>
普通链接（自带navigator-hover）：
<navigator url='xxx'>链接navigator>
PS：在测试的时候发现对于button似乎不太好使。
参考：https://developers.weixin.qq.com/blogdetail?action=get_post_info&lang=zh_CN&token=&docid=000caed01d8ca8fa7c1734f3b51c04
欢迎关注，有问题一起学习欢迎留言、评论。
你要保守你心，胜过保守一切。
作者：刘俊涛的博客
