/**
* 按钮节流函数
* @param el 挂载的元素
* @param dbclick 使用的方法
* @param time 传入的元素 time.value为传入的值
*/
Vue.directive('dbclick', function (el, time) {
let timestamp = ''
if (typeof time.value === 'number' && !isNaN(time.value)) { // 判断为数字
timestamp = time.value
} else {
timestamp = 2000 // 默认2s
}
el.addEventListener('click', e => {
if (!el.disabled) { // 按钮的表单类都带disabled
el.disabled = true
if ($(el).find("input").attr("type") == "checkbox") {
$("#checkBoxDis").css("display", "block")
}
el.style.cursor = 'not-allowed' //禁止样式
setTimeout(() => {
el.style.cursor = 'pointer' // 小手样式
el.disabled = false
if ($(el).find("input").attr("type") == "checkbox") {
$("#checkBoxDis").css("display", "none")
}
}, timestamp) // 2s仅可调用一次
}
})
})
vue 自定义指令 按钮节流函数
最新推荐文章于 2024-05-20 15:10:23 发布