js实现单击事件和双击事件

js实现单击事件和双击事件

目的

1.希望通过单击事件调用ajax方法
2.希望通过双击事件修改选中的对象的背景色，从而获取选中的对象

思想

1.首先设置一个状态值为false
2.点击的时候，判断状态值是true还是false,如果是false表示第一次点击，将false转为true,同时开启定时器，定时0.25秒,如果0.25秒后没有第二次点击，那么执行单击函数，并将状态值改为false
3.点击的时候，如果判断状态值是true,那么是0.25秒内的第二次点击，清除定时器，同时设置状态值为false

代码实现

 //设置定时对象
    var timer;
    $('#rooms').children().click(function(){
		var id=$(this).children().attr("id");
	
		if(id!=undefined){
			if(clickLable){
			//双击事件
				//清除定时
				clearTimeout(timer);
				//双击函数的处理过程--开始
				var classroomColor="zkt"+id;
				if($("#"+classroomColor).css("backgroundColor")=="rgb(152, 245, 255)"){
					$("#"+classroomColor).css("backgroundColor","rgb(230, 230, 230)");
					delete mapColor[id];
				}else{
					$("#"+classroomColor).css("backgroundColor","rgb(152, 245, 255)");
					
					mapColor[id] = $("#"+classroomColor).text();
				}
				//双击函数的处理过程--结束
				
				clickLable = false;
			}else{
			//单击事件
				clickLable=true;
				
				//启动定时
				timer = setTimeout(function(){//初始化一个延时
			        clickLable=false;
			        //单击函数的处理过程--开始
					$.ajax({
						cache:false,
						type:'get',
						url:'goDataToPC',
						data:{"classroomid":id},
						dataType:"json",
						success:function(data){
							if(data.state==0){
								parent.layer.open({
									  title: '信息'
									  ,content: data.msg
									}); 
							}else{
								parent.layer.open({
									  title: '信息'
									  ,content: '请打开pc客户端重试'
									}); 
								}
							}
						})
					//单击函数的处理过程--结束
			      },250)
			}
				

		}
	});