当前位置是:帝豪2娱乐 > 公司动态 > 公司动态

javascript模拟实现ajax加载框实例

来源:wehoppe.com 作者:酸起 发布时间:2018-01-08 点击量:

  

[javascript,模拟,实现,ajax,加载框]javascript模拟实现ajax加载框实例

  

本文实例讲述了javascript模拟实现ajax加载框的方法,分享给大家供大家参考。具体方法如下:  帝豪娱乐注册

  

代码如下:

function loading(p_value,str)  
  {  
  if (p_value)  
  {  
  if (!document.getElementById("load_area"))  
  {  
  var para1 = document.createElement("span");  
  var node=document.createTextNode(str);  
  para1.appendChild(node);  
  var para=document.createElement("div");  
  para.id="load_area";  
  var top=document.body.scrollTop+document.documentElement.scrollTop;//获取页面中的实际高度  
  top_position = top+157 + "px";  
  para.style.top =top_position;  
  icon.style.cssText += ";vertical-align:middle;padding-right:4px;margin-top:-2px;"  
  para.style.cssText +=  
  ";position:absolute;left:50%;width:140px;margin-left:-70px;height:50px;line-height:50px;font-size:18px;text-overflow:ellipsis;overflow:hidden; white-space:nowrap;text-align:center;background-color: #000;border-radius:2px;-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.5);color:#eee;";  

  

var icon = new Image();  
  icon.src="images/loading1.gif";//这里用实际路径替换  
  document.body.appendChild(para);  

  

para.appendChild(icon);  

  

para.appendChild(para1);  

  

}  
  else  
  {  
  document.getElementById("load_area").style.display="block";  
  }  
  }  
  else  
  {  
  document.getElementById("load_area").style.display="none";  
  }  
  }

  

  

调用方法如下: 代码如下:

loading(true,"加载中..."); loading(false)
  

  

希望本文所述对大家的web前端程序设计有所帮助。

  




上一篇:帝豪娱乐平台:jquery简单瀑布流实现原理及ie8下测

下一篇:没有了