onmousemove的问题

本帖最后由 wwjavaww 于 2009-12-22 10:47:12 编辑

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

elRow.onmousemove=function(){ //你这一句是叫左边的表格onmousemove，实际上你是想拖动右边的表格出发这个事件？那这里是不是应该是tableBox2.onmousemove=function(){ ...}
if(t2.dragFlag){//如果table2拖拉开始
alert("onmousemove起作用了");
//...table.insertRow();
}
};
<%@ page language="java" contentType="text/html; charset=gbk"%><%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean"%>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles"%>
<%response.setHeader("Cache-Control", "no-cache"); %>
<html >
<head>
<title>jquery</title>
<script src="js/jquery.js"></script>
<script language="javascript">
  var beginMoving=false;
$(function(){
  t2=Table2();
  t=Table1();

});
function Table1 (){
var tableBox=document.getElementById("tableBox");
var table=document.createElement("table");
$(table).attr("id","baseTable");
table.border=1;
var elRow=table.insertRow();
$(elRow).attr("id","baseTr");
$(elRow).attr("name","baseTr");
var elCell=elRow.insertCell();
elCell.innerText="000000000000000000";
tableBox.appendChild(table);
}
function Table2 (){
var tableBox=document.getElementById("tableBox2");
var table=document.createElement("table");
$(table).attr("id","moveTable");
table.border=1;
var elRow=table.insertRow();
$(elRow).attr("id","moveTr");
$(elRow).attr("name","moveTr");
var tr=$("#moveTr");
tr.css('cursor','move');
tr.css('position','relative');
var elCell=elRow.insertCell();
elCell.innerText="111111111111111111";
tableBox2.appendChild(table); $("#moveTr").mousedown(function(){
  this.style.zIndex=1;
  this.mouseDownY=event.clientY;
  this.mouseDownX=event.clientX;
  beginMoving=true;
  this.setCapture();
});
$("#moveTr").mousemove(
function(){
   if(!beginMoving) return false;
   this.style.top = (event.clientY-this.mouseDownY);
   this.style.left = (event.clientX-this.mouseDownX);
});
$("#moveTr").mouseup(function(){
   if(!beginMoving) return false;
   this.releaseCapture();
   this.style.top=0;
   this.style.left=0;
   this.style.zIndex=0;
   beginMoving=false;
   var tempTop=event.clientY-this.mouseDownY;
   var tempLeft=event.clientX-this.mouseDownX;
   var baseTr=$("#baseTr");
   var tempRowIndex=(tempTop-tempTop%25)/25;
   var x=document.getElementById("baseTable").insertRow(1);
   var y=x.insertCell(0);
   var temp=$("#moveTr").text();
   $(y).text(temp);
   document.getElementById('moveTable').deleteRow(0);
});
}
</script>
</head>
<body>
  <div id=tableBox  style='position:absolute; top:50px;
  BORDER: #cecece 1px solid;left:20px;width:300px;height:200px'> </div>
  <div id=tableBox2  style='position:absolute; top:50px;
  BORDER: #cecece 1px solid;left:325px;width:300px;height:200px'>把这里的行拖拉到左边 </div>
</body>
</html>
楼上你的不是拖拽事件，随便一点击就过去了，楼主你就可以加载一个拖拽事件的，用this来表示被拖拽的，拖拽到左边的时候，this  remove   左边add就可以了
楼主，正常的拖拽是mousedown,mousemove,mouseup三个事件结合完成的，即在mousedown中有mousemove和mouseup事件！你的mouseup事件什么都没有做，就是一空壳！应该在mouseup事件中把你绑定的事件松绑，即置成null！
给你一个我收藏的网站，上面肯定能满足你的要求。http://www.cnblogs.com/sw22225458/archive/2008/01/05/1026842.html