JavaScript黑暗技巧:禁止浏览器点击“后退”按钮

浏览网页时,当从A页面点击跳转到B页面后,一般情况下,可以点击浏览器上的“后退”按钮返回A页面。

如果进入B页面后,B页面想让访问者留下,禁止返回,是否可以实现呢?

这简直是要控制浏览器的行为,虽然有些邪恶,但确实可以实现,使用特殊的JavaScript代码就可实现。

方法如下:

实现原理:
监听浏览器的popstate事件,该事件会在用户点击浏览器的回退按钮时被触发。

然后,使用History.pushState()方法向当前浏览器会话的历史堆栈中添加一个陷阱状态,该状态会使“回退”操作无效。

<script>

	//浏览器返回键事件
	
	pushHistory();
	
	window.addEventListener("popstate", function(e) {
	
	//判断移动端
	
	var userAgentInfo = navigator.userAgent;
	
	var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod");
	
	var equipmentType = false;
	
	for (var v = 0; v < Agents.length; v++) {
	
		if (userAgentInfo.indexOf(Agents[v]) != -1) {
	
			equipmentType = true;
	
			break;
	
	}
	
	}
	
	if (equipmentType) {
	
		$("#mask-back").show();
	
		$("#mask-back .back-close").on("click", function() {
	
		$("#mask-back").hide();
	
	})
	
	}
	
	pushHistory(); //注,此处调用,可以让用户一直停留着这个页面
	
	}, false);
	
	function pushHistory() {
	
		var state = {
	
			title: "title",
	
			url: "#"
	
	};
	
	window.history.pushState(state, "title", "#");
	
	}

</script>
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值