1.点击跳转详情页。
2.长按显示遮罩层和删除按钮
3.点击删除按钮,删除此项。
下面会详细介绍我处理此问题时所出现的问题,及处理方法(本文基于jQuery)
首先我对列表添加了长按事件,添加完之后,发现我的长按事件已经可以成功执行了。但是却出现了新的问题:
这个问题好处理,只需添加一个变量,来判断是否为长按事件
这样上面的问题就完美解决了。
接下来就是给遮罩层上的删除按钮添加事件
但是在这里就发现了新的问题
所以就需要一个新的事件来覆盖原本的事件
然后,整个点击跳转,长按显示删除,删除事件,就已经完美解决了。
但是,在移动端查看的时候就会发现正常的滚动事件被preventDefault屏蔽了。
此处有两种解决方式:
1.删除 e.preventDefault()
删除preventDefault有可能会出现其它情况,不过我暂时没发现如果出现其它情况,可使用下面的方法
删除的点击事件也是如此
By : Yimi-shan
最近在做一个项目,点击一个按钮,弹出一张图片,长按图片保存图片,点击图片图片隐藏。
在做的时候发现,当我们长按图片的时候也会执行点击图片的事件,这时候我们就需要判断长按事件和点击事件了。
html
js
window对象有两个方法来实现定时功能,即window.setTimeout()
,用来在制定时间后运行
window.setInterval()
,用来指定每隔一段时间重复运行
以及window.clearInterval()用来清除定时
用按钮的
onmousedown
,
onmouseup
,
onclick
事件组合来实现以下功能
代码如下
<script>
var
plusview
var
minusview
var
a=0
function
hello(){
document.getElementById("resultspan").innerHTML="5秒钟后显示我!!!长案按钮显示效果"
}
window.setTimeout("hello()",5000)
function
viewpluslong()
{
plusview=window.setInterval("viewplus()",100)
}
function
stopplus()
{
window.clearInterval(plusview)
}
function
viewminuslong()
{
minusview=window.setInterval("viewminus()",100)
}
function
stopminus()
{
window.clearInterval(minusview)
}
function
viewplus()
{
a=a+1
document.getElementById("resultspan").innerHTML=a.toString()
}
function
viewminus()
{
a=a-1
document.getElementById("resultspan").innerHTML=a.toString()}
</script>
<html>
<input
id="buttondown"
type="button"
value="<<
-减
"
onclick="viewminus()"
onmousedown="viewminuslong()"
onmouseup="stopminus()"
/>
<input
id="buttonup"
type="button"
value="加
+
>>"
onclick="viewplus()"
onmousedown="viewpluslong()"
onmouseup="stopplus()"
/>
(按住按钮不放可连续缩放)
</br>
result
is
:
<span
id="resultspan"
style="color:red"></span>
</html>