js之绑定到div上面的事件如何取消

场景：最常见的一种场景就是按钮点击。如果按钮点击之后要发生变化的话。会由可点变为不可点。

思路：

一、首先会想到如果把绑定事件的class remove掉的话，是不是可以。
二、可以查看是否可以禁用点击事件实现。
三、可以添加一个class。在另外的class上面阻止其他点击事件。
即return false。

思路一实现：

//写法一：
$("body").on('click',".J_toShake", function (e) {
	$(this).addClass("gray").removeClass("J_toShake").html("已摇奖");
});

//写法二：
$(".J_toShake").on('click',function (e) {
	$(this).addClass("gray").removeClass("J_toShake").html("已摇奖");
});
//写法三：
$("body .J_toShake").on('click',function (e) {
	$(this).addClass("gray").removeClass("J_toShake").html("已摇奖");
});

写法一可用。写法二、三不可用。
原因分析：
直接绑定元素上面。会在缓存中存住这个事件元素。如果后期想去掉元素上面的事件。如果是直接删除id或者是class是不能实现的。
然而如果是绑定到body的话。后期捕获到元素上面的话就是可以的。

思路二实现：

	var clicked=false;
	// 点击去摇奖
	$(".J_toShake").on('click',function (e) {
		if(clicked){
                         //移除指定的事件函数
			//$(this).off(e);
                        //移除click事件处理程序
                        //$(this).off("click");

			return;
		}
		$(this).addClass("gray").removeClass("J_toShake").html("已摇奖");
		clicked=true;
	});

思路三实现：

	var clicked=false;
	// 点击去摇奖
	$(".J_toShake").on('click',function (e) {
		if(clicked){
                         //移除指定的事件函数
			//$(this).off(e);
                        //移除click事件处理程序
                        //$(this).off("click");

			return;
		}
		$(this).addClass("gray").removeClass("J_toShake").html("已摇奖");
		clicked=true;
	});