<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/jquery.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<style>
div {
text-align: center;
}
</style>
</head>
<body>
<div>
<button id="add">+</button>
<button id="sub">-</button>
</div>
<script>
function bb(id) {
var isdown = false // 判断鼠标是否按下
var islong = false // 判断是否是长按
var t = undefined // 定时器
$('#' + id).on('mousedown', () => {
isdown = true
t = setTimeout(() => {
islong = true
longClick()
}, 1000)
})
$('#' + id).on('mouseup', () => {
init()
})
$('#' + id).on('mouseleave', () => {
if (isdown) init()
})
// 长按
function longClick() {
console.log('longClick')
// 长按时轮询调用longClick()
if (islong) setTimeout(() => {
longClick()
})
}
// 单击
function click() {
console.log('click')
}
// 停止操作
function stop() {
console.log('stop');
}
// 初始化状态
function init() {
if (!islong) click()
setTimeout(() => {
stop()
}, 500)
// 初始化数据，清除定时器
clearTimeout(t)
islong = false
isdown = false
}
}
bb('sub')
</script>
</body>
</html>
07-14
2659
2659
“相关推荐”对你有帮助么？
-
非常没帮助 -
没帮助 -
一般 -
有帮助 -
非常有帮助
提交
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
