判断页面加载后是否所有的下拉框都有数据

最新推荐文章于 2024-12-13 17:30:28 发布

原创最新推荐文章于 2024-12-13 17:30:28 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#select

前端专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种解决页面加载不完全的方法，通过检查特定下拉框元素来判断页面是否加载成功，并在必要时重新加载页面。适用于网络不稳定时确保用户体验。

业务场景：

在页面加载的过程中，可能由于网络等原因造成某些下拉列表的值没有加载到，为了解决这个问题，可以在页面加载后对所有的下拉框进行判断，如果有下拉框的值为空，那么就重新加载整个页面。

js代码

<script type="text/javascript">
//页面加载时执行函数
window.onload=function(){
	//判断是否所有的下拉框都有数据，这里要使用延迟，因为页面发送ajax请求获取下拉列表需要时间
	setTimeout('checkSelect()',3000);
}
</script>
<script type="text/javascript">
	function checkSelect(){
		if(document.getElementById("manageTypeId").options.length <= 1 
			|| document.getElementById("enterpriseTypeId").options.length <= 1
			|| document.getElementById("accountingTypeId").options.length <= 1
			|| document.getElementById("enterpriseClassId").options.length <= 1
			|| document.getElementById("ceoCertTypeId").options.length <= 1
			|| document.getElementById("caterClassId").options.length <= 1
			|| document.getElementById("chargePersonCertTypeId").options.length <= 1
			|| document.getElementById("operatingCharacteristicsId").options.length <= 1
			|| document.getElementById("manageHouseTypeId").options.length <= 1
			|| document.getElementById("managementModelId").options.length <= 1
			|| document.getElementById("warehouseUsageModeId").options.length <= 1
		){
			if(confirm('由于网络原因，页面未加载成功，请点击确定重新加载！')){
				//重新加载页面
				window.location.href=window.location.href;
			}
		}
	}
</script>