layui弹出层第一次打开不居中_layui弹出层auto跑到左边-CSDN博客

本文介绍了解决layui弹出层在页面加载后首次显示时无法居中的问题。通过将弹窗代码包裹在layer.ready方法中，确保了无论何时打开，弹窗都能正确地居中显示。

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

layui弹出层第一次打开不居中解决方法

使用layui的弹出层时，每次刷新后第一次弹出都会出现最左侧（默认状态的auto水平锤子居中状态）。第二次及以后弹出才回居中。

layui.use("layer",function(){
	var layer = layui.layer;
	layer.prompt({
		value: 'E:\\文档\\新建文件夹',
		title: '请输入上传项目文件的根目录'
	}, function(value, index, elem){
		var paraMap = new HashMap();
		doCallAjax.doAsynchronousAjax("", "", paraMap, doDataSynSuccess);

		function doDataSynSuccess(result) {
			tips.hide();
			if (result["status"] == "200") {
				tips.show("上传完成！");
				projectStatisticsModule.show();
			} else {
				tips.show("上次失败，" + result["message"]);
			}
		}
		layer.close(index);
	});
})

结果第一次弹出时效果：
在这里插入图片描述

解决方法

在弹框方法外面套层layer.ready方法

layer.ready(function () {
	// 弹框代码
})

在这里插入图片描述

最终代码

layui.use("layer",function(){
	var layer = layui.layer;
	layer.ready(function () {
		layer.prompt({
			value: 'E:\\文档\\新建文件夹',
			title: '请输入上传项目文件的根目录',

		}, function(value, index, elem){
			var paraMap = new HashMap();
			tips.show("开始上传。。");
			doCallAjax.doAsynchronousAjax("", "", paraMap, doDataSynSuccess);

			function doDataSynSuccess(result) {
				tips.hide();
				if (result["status"] == "200") {
					tips.show("上传完成！");
					projectStatisticsModule.show();
				} else {
					tips.show("上次失败，" + result["message"]);
				}
			}
			layer.close(index);
		});
	})
})