js 实现控制点击事件在特定的毫秒内 只允许点击一次(防止重复点击)

js 实现控制点击事件在特定的毫秒内 只允许点击一次(防止重复点击)

1.第一种方法

function fn(callback){
	fn.prototype.init(callback);
}
fn.prototype = {
	canclick: true,
	init: function(callback){
		if(this.canclick){
			this.canclick = false
			callback();
			setTimeout(function(){
				this.canclick = true
			}.bind(this),1000)
		}else{
			console.log('1s中之内不允许重复点击')
		}
	}
}

使用如下：

$("#content").click(function(){
		fn(function(){
				// 将点击执行的代码放在这里就可以实现 防止重复执行
		});
})

2第二种方法

var forbidRepeartClick = (function(){
	var instance = null;
	var canClick = true;
	function Build(){
		this.setClick = function(callback){
			if(canClick){
				canClick = false;
				callback()
				setTimeout(function(){
					canClick = true;
				},1000)
			}else{
				console.log('1s之内不能重复点击')
			}
		}
	}
	
	
	if(!instance){
		instance = new Build();
	}
	
	return instance;
})()

使用如下：

$("#content").click(function(){
		forbidRepeartClick.setClick(function(){
				// 将点击执行的代码放在这里就可以实现 防止重复执行
		});
})

注意：实现原理就是第一次执行函数加一个判断条件，进入执行方法体中，就将判断条件的值修改，延时之后，将判断条件的值修改回去。