繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 写的htc的数据表格
- Javascript
- jQuery中isFunction方法的BUG修复
- 将函数的实际参数转换成数组的方法
- javascript 删除数组中重复项（uniq）
- js 巧妙去除数组中的重复项
- javascript下一种表单元素获取方法存在的问题
- javascript 三种数组复制方法的性能对比
- js 多层叠的TAB选项卡
- javascript 自动标记来自搜索结果页的关键字
- 起点页面传值js,有空研究学习下
- javascript 的Document属性和方法集合
- JavaScript 使用简略语法创建对象的代码
- 使用JQuery进行跨域请求
- jquery 经典动画菜单效果代码
- jquery 常用操作方法
- js提示信息jtip封装代码，可以是图片或文章
- javascript面向对象的方式实现的弹出层效果代码
- jquery中的sortable排序之后的保存状态的解决方法
- js或css实现滚动广告的几种方案
- 使用JavaScript库还是自己写代码？
- js 右键菜单，支持不同对象不同菜单(兼容IE、Firefox)
Javascript 中的 写的htc的数据表格
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-12 浏览: 72 ::
收藏到网摘: n/a
作者:xmg (小马哥)
复制代码 代码如下:
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<style>
body{font-size:12}
table,input,button,select,textarea,b{font-size:12;font-family:宋体}
body{background:#ECE9D8}
td{border:1px solid #c0c0c0;display:inline}
.GridBorder{background:#ece9d8;border:1px solid #000;border-top:1px solid #FFF;border-left:1px solid #FFF;text-align:center;WORD-BREAK:break-all}
</style>
<script>
if(document.all){
Event.prototype.__defineGetter__("srcElement",function(){var node=this.target;while(node.nodeType!=1){node=node.parentNode}return node})
Event.prototype.__defineGetter__("x",function(){return this.clientX+2})
Event.prototype.__defineGetter__("y",function(){return this.clientY+2})
}
function $(obj){return document.getElementById(obj)}
</script>
<BODY>
<table id=datagrid>
<tr>
<td width=15></td>
<td width=50>字段一</td>
<td width=50>字段二</td>
<td width=50>字段三</td>
<td width=50>字段四</td>
<td width=50>字段五</td>
<td width=50>字段六</td>
<td width=50>字段七</td>
<td width=50>字段八</td>
<td width=50>字段九</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</BODY>
</HTML>
<script>
var obj=$("datagrid"),td
var body=document.body
var DragObj=null
var objxy=getxy(obj)
var Dragborder=0
obj.style.cssText="background:#FFF;border-collapse:collapse"
for(var i=0;i<obj.rows.length;i++){
for(var j=0;j<obj.rows[i].cells.length;j++){
td=obj.rows[i].cells[j]
if(i==0){
td.className="GridBorder"
td.style.cssText="font-weight:bold"
}else if(j==0){
td.className="GridBorder"
td.style.cssText="width:15px"
}else{
td.innerHTML="<input type=text value='"+td.innerHTML.replace(/ /gi,'')+"' style='width:100%;border:0px'>"
}
}
}
var focus_img=document.createElement("IMG")
focus_img.src="http://bbs.51js.com/attachment.php?aid=7290&noupdate=yes"
if(typeof(Dline)!="object"){
var Dragline=document.createElement("DIV")
Dragline.id="Dline"
Dragline.style.cssText="width:1px;border-left:1px solid #CCC;display:none;position:absolute"
body.appendChild(Dragline)
}
obj.onclick=function(){
var e=event,tr
var ee=e.srcElement
if(ee.tagName=="INPUT"){
tr=ee.parentNode.parentNode
obj.rows[tr.rowIndex].cells[0].appendChild(focus_img)
}
}
obj.onmousemove=function(){
var e=event,tr
var ee=e.srcElement
if(ee.tagName=="TD"&&ee.parentNode.rowIndex==0&&ee.cellIndex>0){
var a=getxy(ee)
if(event.x<(a[1]+5)||event.x>(a[1]+a[2]-5)){
body.style.cursor="col-resize"
objxy=getxy(obj)
}else{
body.style.cursor="default"
}
}
}
obj.onmousedown=function(){
var e=event
var ee=e.srcElement
var a=getxy(ee)
if(body.style.cursor=="col-resize"){
if(event.x<(a[1]+5))
Dragborder=1
else if(event.x>(a[1]+a[2]-5))
Dragborder=2
else
Dragborder=0
DragObj=ee
$("Dline").style.left=e.x
$("Dline").style.top=objxy[0]
$("Dline").style.height=objxy[3]
$("Dline").style.display=""
}
}
body.onmousemove=function(){
if(DragObj!=null){
$("Dline").style.left=event.x
body.style.cursor="col-resize"
}
}
body.onmouseup=function(){
if(DragObj!=null){
$("Dline").style.display="none"
body.style.cursor="default"
if(Dragborder==2){
var a=getxy(DragObj)
var w=event.x-a[1]
w=w<=0?0:w
DragObj.style.width=w
}
if(Dragborder==1){
var pnode=DragObj.previousSibling
var a=getxy(pnode)
var w=event.x-a[1]
w=w<=0?0:w
pnode.style.width=w
}
DragObj=null
}
}
function getxy(e){
var a=new Array()
var t=e.offsetTop;
var l=e.offsetLeft;
var w=e.offsetWidth;
var h=e.offsetHeight;
while(e=e.offsetParent){
t+=e.offsetTop;
l+=e.offsetLeft;
}
a[0]=t;a[1]=l;a[2]=w;a[3]=h
return a;
}
</script>
评论 (0) All
