AJAX简单应用实例-弹出层

2019-09-20 13:47asp教程网 ASP教程

AJAX的简单应用,包括js弹出DIV层、层拖动、ajax后台读取数据！注意getinfo.asp文件是以utf-8格式保存的，在getinfo.asp里面可以写读数据库代码！

function createobj() {

if (window.ActiveXObject) {

         return(new ActiveXObject("Microsoft.XMLHTTP"));

     }

     else if (window.XMLHttpRequest) {

         return(new XMLHttpRequest());

     }

}

function personalInfo() {

  var oBao=createobj();

  var cont=document.getElementById("person_detial");

  var cont_a=document.getElementById("person_content");

  cont.style.display='block';

  cont.style.cursor='pointer';

  cont_a.innerHTML="请等待,加载中...";

  var my_url="getinfo.asp?"+Math.random();

  oBao.open("get",my_url,true);

  oBao.onreadystatechange=function(){

  if(oBao.readyState==4){

   if(oBao.status==200){

     cont_a.innerHTML=oBao.responseText;

     }else{

     cont_a.innerHTML="出现错误,错误代码为:"+oBao.status;

    }

  }

  }

  oBao.send();

}

function Drag(id)

{

var self=this;

this.obj=(typeof(id)=="string")?document.getElementById(id):id;

this.obj.onmousedown=function(e)

{

e=e||window.event;

var obj=self.obj;//指向自己

if(e.layerX){obj.position={x:e.layerX,y:e.layerY};}

else{obj.position={x:e.offsetX,y:e.offsetY};}

document.onmousemove=self.start;

document.onmouseup=self.end;

}

this.start=function(e)

{

e=e||event;

document.onselectstart = function(){ return false; };

window.getSelection && window.getSelection().removeAllRanges();

var obj=self.obj;

obj.style.left=e.clientX-obj.position.x+"px";

obj.style.top=e.clientY-obj.position.y+"px";

}

this.end=function(e)

{

e=e||event;

document.onmousemove = document.onmouseup = document.onselectstart = null;

}

}