作者idcomputer (顺)
看板Ajax
标题Re: [问题] 有办法取得PHP的动态变数?!
时间Fri Sep 19 12:21:20 2008
※ 引述《TonyQ (沉默是金)》之铭言:
: ※ 引述《idcomputer (顺)》之铭言:
: : 刚刚测试了一下
: : <div id="<?php echo $row['id']; ?>"...略...onmouseup="alert(this.id)">..</div>
: : 在移动完图层有ALERT出该图层的标签id
: : 那该怎麽去把这个id存在变数中呢?!
: : 如果想要套过ajax的方式用抓取到的id变数与抓取到的图层座标值(移动过後的)
: : 来更新资料表该如何进行呢?!
: : 大部分ajax书籍都只有点到拖曳图层就停止了,所以上这来请教大家~~感恩
: 其实完全是观念的问题...
: 不过如果你还是要提供一下你怎麽实做拖曳的,
: 这样会比较好告诉你怎麽样取得那个id.
如下~~~有点长~~~抱歉ORZ
<script type="text/javascript">
//判断浏览器种类
var ns = (navigator.vendor == ("Netscape6") || navigator.product == ("Gecko"));
var ie = (document.all);
var _dragobj,_dragActive=true;
var _dragobj,_dragActive=true;
var _maxi=0,_curri,_className;
//***************************************取得滑鼠游标位置
function mouseMove(e){
//set drag status
_dragActive=false;
//取得滑鼠游标位置
x=(ns)?e.pageX:event.x;
y=(ns)?e.pageY:event.y;
//移动图层
_dragobj.style.left=(_cx+x)+'px';
_dragobj.style.top=(_cy+y)+'px';
}
function mouseUp(e){
_dragobj.className=_className;
//设定可拖曳状态
_dragActive=true;
_maxi++;
document.onmousemove=noopMouse;
document.onmousedown=noopMouse;
document.onmouseup=noopMouse;
snapGrid(true);
function mouseDown(e){
dragable=(_dragobj.getAttribute('dragable')=='dragable');
_className=_dragobj.className
_dragobj.className=(dragable)?'op':_className;
//alert(_dragobj.style.filter);
//将目前图层提到最上层
_dragobj.style.zIndex=_maxi;
//将控制权交给MOUSEMOVE
document.onmousemove=mouseMove;
//取得目前滑鼠与图层左上角位置的差距
x=(ns)?e.pageX:event.x;
y=(ns)?e.pageY:event.y;
_cx=_dragobj.offsetLeft-x;
_cy=_dragobj.offsetTop-y;
}
function noopMouse(e){
return false;
}
function hitTest(a,b){
//is current layer overlay with other ?
var ax,ay,aw,ah;
var bx,by,bw,bh;
ax=a.offsetLeft;
ay=a.offsetTop;
aw=parseInt(a.style.width);
ah=parseInt(a.style.height);
bx=b.offsetLeft;
by=b.offsetTop;
bw=parseInt(b.style.width);
bh=parseInt(b.style.height);
if((ax+aw)>=bx && ax <=(bx+bw) && (ay+ah) >=by && ay <= (by+bh)){
return true
}else{
return false
}
}
//初始化************************************************
function dragInit(){
var i, a, main,obj;
//检查所有文件中的DIV标签,并未DIV加上 Z-INDE的属性
for(i=0; (a = document.getElementsByTagName("div")[i]); i++) {
obj=document.getElementById(a.getAttribute("id"));
if (obj.style.zIndex==null || obj.style.zIndex==''){
obj.style.zIndex=i;
}
_maxi=Math.max(obj.style.zIndex,_maxi);
}
//记录目前最大的Z-INDEX值
_maxi++;
}
//避免滑鼠指示停在涂层上就开始动作,增设_dragActive检查
function startDrag(layerName){
//is this layer dragable?
dragable=(document.getElementById(layerName).getAttribute('dragable')
=='dragable');
//to avoid when mouse over layer, change layer obj
if (_dragActive&&dragable){
if (document.getElementById(layerName)!='null'){
_dragobj=document.getElementById(layerName);
document.onmousedown=mouseDown;
document.onmouseup=mouseUp;
}
}else{
document.onmousemove=noopMouse;
document.onmousedown=noopMouse;
document.onmouseup=noopMouse;
}
}
function snapGrid(b){
var grid=20;
var diffx=parseInt(_dragobj.style.left)%grid;
var diffy=parseInt(_dragobj.style.top)%grid;
if (b){
_dragobj.style.left=parseInt(_dragobj.style.left)+
((diffx>(grid/2))?(grid-diffx):(0-diffx))+'px';
_dragobj.style.top=parseInt(_dragobj.style.top)+((diffy>
(grid/2))?(grid-diffy):(0-diffy))+'px';
}
}
function isDragable(layerName){
//确认图层是否可移动?
dragable=(document.getElementById(layerName).getAttribute('dragable')
=='dragable');
document.getElementById(layerName).style.cursor='move';
}
function lockDrag(layerName){
document.getElementById(layerName).setAttribute('dragable','fixed');
}
function releaseDrag(layerName){
document.getElementById(layerName).setAttribute('dragable','dragable');
}
</script>
<body onload="dragInit();">
<?php do { ?>
<?php
$x = $row['x'];
$y = $row['y'];
?>
<div id="<?php echo $row['id']; ?>"
dragable="dragable"
class="board"
style="position: absolute;
top: <?php echo $row['y']; ?>px;
left: <?php echo $row['x']; ?>px;
onmouseover="isDragable(this.id);"
onmousedown="startDrag(this.id);"
>
<?php } while ($row = mysql_fetch_assoc($res)); ?>
</body>
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 61.221.166.118