php+ajax剪切图片

<script><br />//目标源<br />var target;<br />//拖拽辅助容器<br />var helper;<br />//鼠标默认状态（false=没有按下）<br />var imousedown=false;<br />//当前的目标源<br />var ctar;<br />//鼠标偏移量<br />var mouseoff;<br />//ajax相关<br />var ajax;<br />//继承number类的nana0，用途为：如果一个数为100px会返回100。<br />number.prototype.nan0=function(){return isnan(this)?0:this;}<br />//初始化ajax<br />function createrequest(){<br />var ajax;<br />if(window.activexobject){<br /> try{<br /> ajax = new activexobject("microsoft.xmlhttp");<br /> }catch(e){<br /> ajax = false;<br /> }<br />}else{<br /> try{<br /> ajax = new xmlhttprequest();<br /> }catch(e){<br /> ajax = false;<br /> }<br />}<br />if(!ajax){<br /> alert("error creating the xmlhttprequest object.");<br />}else{<br /> return ajax;<br />}<br />}<br />//反送ajax请求<br />function cutp(cutc){<br />ajax=createrequest();<br />ajax.onreadystatechange = action;<br />//发送请求的url<br />url = "path=./test1.jpg&x="+parseint(cutc.style.left)+"&y="+parseint(cutc.style.top)+"&width="+parseint(cutc.offsetwidth)+"&height="+parseint<br />(cutc.offsetheight);<br />window.status = url;<br />ajax.open("get", "image.php?"+url, true);<br />ajax.send(null);<br />}<br />function action(){<br />var show = document.getelementbyid("show");<br />//如果show这个容器原先有子节点，就清楚子节点<br />if(show.haschildnodes()){<br /> show.removechild(show.childnodes[0]);<br />}<br />//状态为4&200的时候返回信息<br />if(ajax.readystate==4&&ajax.status==200){<br /> show.innerhtml = ajax.responsetext;<br />}<br />}<br />//创建可拖拽容器<br />function createcontainer(arg){<br />helper = document.getelementbyid('helper');<br />//设置属性<br />helper.setattribute("cut",1);<br />arg.onmouseover = function(){<br /> helper.style.display="block";<br />}<br />arg.onmouseout = function(){<br /> helper.style.display="none";<br />}<br />helper.ondblclick = function(){<br /> cutp(helper);<br />}<br />}<br />//获取鼠标位置<br />function mousecoords(ev){<br />if(ev.pagex || ev.pagey){<br /> return {x:ev.pagex, y:ev.pagey};<br />}<br />return {<br /> x:ev.clientx + document.body.scrollleft - document.body.clientleft,<br /> y:ev.clienty + document.body.scrolltop - document.body.clienttop<br />};<br />}<br /><br />//获取鼠标在当前容器的偏移量<br />function getmouseoffset(target, ev){<br />ev = ev || window.event;<br />var docpos = getposition(target);<br />var mousepos = mousecoords(ev);<br />return {x:mousepos.x - docpos.x, y:mousepos.y - docpos.y};<br />}<br />//获取鼠标相对父节点的偏移量<br />function getposition(e){<br />var left = 0;<br />var top = 0;<br />while (e.offsetparent){<br /> left += e.offsetleft + (e.currentstyle?(parseint(e.currentstyle.borderleftwidth)).nan0():0);<br /> top += e.offsettop + (e.currentstyle?(parseint(e.currentstyle.bordertopwidth)).nan0():0);<br /> e = e.offsetparent;<br />}<br />left += e.offsetleft + (e.currentstyle?(parseint(e.currentstyle.borderleftwidth)).nan0():0);<br />top += e.offsettop + (e.currentstyle?(parseint(e.currentstyle.bordertopwidth)).nan0():0);<br />return {x:left, y:top};<br />}<br />//鼠标移动处罚的函数<br />function mousemove(ev){<br />ev = ev||window.event;<br />var tar = ev.target||ev.srcelement;<br />var mousepos = mousecoords(ev);<br />var rootar = tar.parentnode;<br />var mouseof = getposition(rootar);<br />//判断状态<br />if(imousedown&&mouseoff){<br /> var limlefx=mouseof.x+rootar.offsetwidth-tar.offsetwidth;<br /> var limbottomy =mouseof.y+rootar.offsetheight-tar.offsetheight;<br /> var conleft = mousepos.x-mouseoff.x;<br /> var contop = mousepos.y-mouseoff.y;<br /> if(conleft>=mouseof.x&&conleft<=limlefx){<br /> helper.style.left = mousepos.x-mouseoff.x;<br /> }<br /> if(contop>=mouseof.y&&contop<=limbottomy){<br /> helper.style.top = mousepos.y-mouseoff.y;<br /> }<br />}<br />}<br /><br />//鼠标按键起来的函数<br />function mouseup(){<br />imousedown = false;<br />}<br /><br />//按下鼠标按键的函数<br />function mousedown(ev){<br />imousedown = true;<br />ev = ev||window.event;<br />var tar = ev.target||ev.srcelement;<br />if(tar.getattribute("cut")){<br /> var hmouseoff = getposition(tar);<br /> helper.style.left = hmouseoff.x;<br /> helper.style.top = hmouseoff.y;<br /> mouseoff = getmouseoffset(tar,ev);<br />}<br />}<br />//监听事件<br />document.onmouseup = mouseup;<br />document.onmousemove = mousemove;<br />document.onmousedown = mousedown;<br />window.onload=function(){<br />target = document.getelementbyid("image");<br />createcontainer(target);<br />}<br /></script>