DataGrid 用鼠标拖动改变列宽,怎么做？

解决方案 »

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

改变整个dataGrid的宽度还是某一列的宽度??
如果是某一列,好象不能用鼠标吧,你还是到属性生成器里去调吧!
如果webform, 用第三方的组件
正规的datagrid不可能有这样的功能
要不用HtmlTable
要不重写MS的datagrid，自己加这种方法
要做到这一点，多多学学js吧，例如：a.html
-----------------------------------------------------------------------------
<html>
<head>
<META http-equiv=Content-Type content="text/html; charset=GBK">
</head>
把鼠標放於紅線上,本例限定隻能在第一行調行寬
<table id="tbl" border=1 cellspacing="0" cellpadding="0">
<tr><td style="border-right:1pt solid red;">標題一</td><td style="border-right:1pt solid red;">標題二</td><td>標題三</td></tr>
<tr><td style="border-bottom:1pt solid red;">內容一</td>
<td style="border-bottom:1pt solid red;">內容二</td>
<td style="border-bottom:1pt solid red;">內容三</td>
</tr>
<tr>
<td>
        內容A
</td>
<td colspan=2>
       內容B
</td>
</tr>
</table>
<script language="javascript">
SetResizeAble(document.all("tbl"))
var onDrag=0,gblResizeObj;function SetResizeAble(argTable){
with(argTable){
attachEvent('onmousedown',ColResizeStart)
attachEvent('onmousemove',ColResizeIng)
attachEvent('onmouseup',ColResizeEnd)
}
}function FindPos(obj){
var x=obj.offsetLeft, y=obj.offsetTop;
while(obj=obj.offsetParent){x += obj.offsetLeft;y += obj.offsetTop;}
this.intX=x; this.intY=y;
return this
}function ColResizeStart(){
var srcObj=event.srcElement,tblParent=srcObj.parentElement;
while(tblParent.tagName!='TABLE')tblParent=tblParent.parentElement

if(srcObj.tagName!='TD')return
if(srcObj.parentElement.rowIndex==0){
if(srcObj.offsetWidth - event.offsetX <=3 && srcObj.cellIndex!=srcObj.parentElement.cells.length - 1){
gblResizeObj=tblParent.rows[srcObj.parentElement.rowIndex].cells[srcObj.cellIndex];
onDrag=1;
}
if(event.offsetX <=3 && srcObj.cellIndex != 0){
gblResizeObj=tblParent.rows[srcObj.parentElement.rowIndex].cells[srcObj.cellIndex - 1];
onDrag=1;
}
}else{
if(srcObj.offsetHeight - event.offsetY <=3 && srcObj.parentElement.rowIndex < tblParent.rows.length - 1){
gblResizeObj=tblParent.rows[srcObj.parentElement.rowIndex].cells[srcObj.cellIndex];
onDrag=2;
}
}
}function ColResizeIng(){
var objSrcTd=event.srcElement,tblParent=objSrcTd.parentElement;
while(tblParent=tblParent.parentElement)if(tblParent.tagName=='TABLE')break;
if(objSrcTd.tagName == "TD" && (Math.abs(event.offsetX) <= 3 || Math.abs(objSrcTd.offsetWidth - event.offsetX)<=3) && objSrcTd.cellIndex != 0 && objSrcTd.parentElement.rowIndex==0){
objSrcTd.document.body.style.cursor='col-resize';
}
else{
if(objSrcTd.tagName == "TD" && Math.abs(objSrcTd.offsetHeight - event.offsetY)<=3 && objSrcTd.parentElement.rowIndex > 0 && objSrcTd.parentElement.rowIndex < tblParent.rows.length - 1){
objSrcTd.document.body.style.cursor='row-resize';
}else{
objSrcTd.document.body.style.cursor='default';
}
}
if(onDrag!=1 && onDrag!=2)return;
var trSrc=gblResizeObj.parentElement;

if(onDrag==1){
var intPosX=(new FindPos(gblResizeObj)).intX
gblResizeObj.style.pixelWidth = event.x - intPosX;
}
if(onDrag==2){
var intHeight=0,intPosY=(new FindPos(gblResizeObj)).intY
intHeight = objSrcTd.offsetHeight + event.y - intPosY;
tblParent.style.pixelHeight = intHeight * tblParent.rows.length
}
}function ColResizeEnd(){
onDrag=0;
document.body.style.cursor='default'
}
</script>
搜索一下，有好几篇这样的问题，最终都是用javascript实现的。因为datagrid解释后都输出
<table id="XXX">...</table>，所以用javascript对table操作
必须的用javascript来事项，datagrid解释后都输出
<table id="d">...</table>，让后想楼上说的，用javascript对table操作