移動端長按事件操作
阿新 • • 發佈:2017-08-02
fun 布局 nbsp right out ldr click z-index dom
之前在公司項目上用到長按,也用過jq mobile,好像與後端用的沖突,就沒用。
這個是長按當前的,當前DOM操作。
布局
<ul id="lis"> <li><span></span></li> <li><span></span></li> <li><span></span></li> <li><span></span></li> <li><span></span></li> </ul>
樣式
#lis li { width: 50px; height: 50px; border: 1px solid #000; margin: 0 10px 15px; float: left; list-style-type: none; position: relative; } #lis li span { width: 10px; height: 10px; background-color: red; position: absolute; right: -5px; top: -5px; display: none; z-index: 5; }
js
$(function(){ $(‘#lis li‘).on({ touchstart: function(e){ var _this = $(this) // 獲取當前的值 timeOutEvent = setTimeout(function(){ timeOutEvent = 0; _this.children(‘span‘).show(); // 操作當前的值 },800); }, touchmove: function(){ clearTimeout(timeOutEvent); timeOutEvent = 0; } }) $(‘#lis li span‘).on(‘click‘,function(){ $(this).parent().remove(); }) });
移動端長按事件操作