js 长按事件、点击事件!

html代码



css代码


.move{
	display: block;
	width: 100%;
}
.movebg{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0.2;
	background-color: #000000;
	z-index: 21;
	display: none;
}

js代码


$(function(){
    var self = this;
	var longClick =0;
	var minilongClick =0;
	$(".move").on({
	    touchstart: function(e){
			        longClick=0;//设置初始为0
			        timeOutEvent = setTimeout(function(){
			            //此处为长按事件-----在此显示遮罩层及删除按钮
			            longClick=1;//假如长按,则设置为1
			            $(".move").css("position","fixed");
			            $(".move").css("top","10%");
			            $(".move").css("left","10%");
			            $(".move").css("width","80%");
			            $(".move").css("z-index","22");
			            $(".movebg").show();
			            // $(".movemini").show();
			        },500);
			    },
			    touchmove: function(){
			        clearTimeout(timeOutEvent);
			        timeOutEvent = 0;
			        e.preventDefault();
			    },
			    touchend: function(e){
			        clearTimeout(timeOutEvent);
			        if(timeOutEvent!=0 && longClick==0){//点击
			            //此处为点击事件----在此处添加跳转详情页
			            
			        }else{
			        	$(".move").css("position","absolute");
			            $(".move").css("top","0");
			            $(".move").css("left","0");
			            $(".move").css("width","100%");
			            $(".move").css("z-index","1");
			            $(".movebg").hide();
			        }
			        return false;
			    }
			});
		})

 

你可能感兴趣的:(js)