【js】alert事件点击确认后指定input恢复焦点

最新推荐文章于 2022-04-10 17:30:35 发布

ColdFireMan

最新推荐文章于 2022-04-10 17:30:35 发布

阅读量4.5k

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： js

本文链接：https://blog.youkuaiyun.com/ColdFireMan/article/details/73287106

前端专栏收录该内容

11 篇文章

订阅专栏

本文介绍了一种在弹出警报后自动使特定输入框获得焦点的方法。通过设置一个名为refocus的对象来标记需要恢复焦点的输入框，并利用jQuery监听窗口点击事件来实现这一功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

之前有那么一个需求,在点击alert之后让input获取焦点,试了很久搞出这个方法,有更好的方法请留言哈哈

在需要生效的页面的js中创建一个js对象

var refocus = new Object();
refocus.status = 0; //初始化为0,表示不生效
refocus.id = ''; //需要恢复焦点的元素id

然后新建一个方法.当浏览器发生点击事件,那么检查alert框是否存在,不存在的情况需要检查是否要启动恢复焦点,这个由标识符,refoucs对象的status值决定,当为0时不执行,为1的时候执行,操作的对象就是id所在的元素.

function setFocus() {
	$(window).on('click', function() {
		//判断alert框是否存在,这里的can是alert的父元素,实际父元素以自己F12看到的为准
		var alertExist = $('#can').children().length > 0; 
		if (!alertExist) {
			if (refocus.status == 1) { //我这里设定的1是需要恢复焦点的标识符
				$('#'+refocus.id).val('').focus();
				refocus.status = 0;
			}
		}
	});
}

然后在你需要生效的地方后面改变refoucs对象即可

alert('我是一个警告框');
//警告框后面修改
refocus.status = 1;
refocus.id='xxx'; //需要恢复焦点的input的id

//也可以直接设定一个方法
function setRefocus(id) {
	refocus.status = 1;
	refocus.id = id;
	}
//然后在alert后面直接调用这个方法即可
alert('我是一个警告框');
setRefocus('xxx');

我这里的设计是只有一个生效的标识符,直接让input清空,然后恢复焦点,也可以细分多种标识符,可以只恢复焦点,不清空,这个是跟着需求走的.