分享
 
 
 

随手写的一个动态添加删除行的HTC行为组件

王朝html/css/js·作者佚名  2006-01-08
窄屏简体版  字體: |||超大  

<!--***************dtable.htc*******************-->

<method name=addnew><method/>

<method name=del><method/>

<method name=lighton><method/>

<property name=nowrow><property/>

<property name=overid><property/>

<property name=myid><property/>

<property name=color0><property/>

<property name=color1><property/>

<ATTACH EVENT="oncontentready" ONEVENT="init()" />

<script language=javascript>

function init()

{

color0="#f8f4e4"; //行间隔色

color1="#f0f0e8"; //行间隔色

myid=0;

nowrow=0;

overid=1;

element.cellSpacing=1;

element.cellPadding=1;

element.border=0;

element.bgColor="#999999"; //边框颜色

element.delcolor="#FFCC99";//删除按钮颜色

element.delcolorover="#6699FF";//删除按钮颜色

var baserow=element.rows[0];

baserow.bgColor="#d8c8a8"; //标题行底色

baserow.style.cursor="default";

lastrow=element.rows[element.rows.length-1];

t=element;

initcolor();

//-----------------开始初始化已经存在的行----------------------

for (i=1;i<t.rows.length;i++)

{

t.rows[i].style.backgroundColor=eval("color"+i%2);

t.rows[i].attachEvent("onclick",lighton);

t.rows[i].style.cursor="default";

t.rows[i].cells[0].style.backgroundColor=element.delcolor;

t.rows[i].cells[0].style.cursor="hand";

t.rows[i].cells[0].attachEvent("onclick",delit);

t.rows[i].cells[0].attachEvent("onmouseover",delmouseover);

t.rows[i].cells[0].attachEvent("onmouseout",delmouseout);

}

//------------开始备份最后一行为动态表复制元素-----------------

t.tr_className=lastrow.className;

t.tr_cssText=lastrow.style.cssText;

t.td_count=lastrow.cells.length;

backupEvent("element.rows[element.rows.length-1]","TR");

for(i=0;i<lastrow.cells.length;i++)

{

backupEvent("element.rows[element.rows.length-1].cells["+i+"]","TD"+i);

t.td_cssText=lastrow.cells[i].style.cssText;

eval("t.td_innerHTML"+i+"=lastrow.cells[i].innerHTML");

}

//-------------------------备份完成----------------------------

}

function delmouseover()

{

ln=rowid();

element.rows[ln].cells[0].style.backgroundColor=element.delcolorover;

}

function delmouseout()

{

ln=rowid();

element.rows[ln].cells[0].style.backgroundColor=element.delcolor;

}

function lighton(line)

{

ln=(line==null||line=="[object]")?rowid():line;

row=element.rows[ln];

initcolor();

row.style.backgroundColor="#33FFFF";

lightcolor(ln);

nowrow=ln;

}

function delit()

{

ln=rowid();

if(element.rows.length!=2)

{

element.deleteRow(ln);

initcolor();

}

}

function del(line)

{

element.deleteRow(line);

initcolor();

}

function rowid()

{

row=window.event.srcElement;

while(row.tagName!="TR")row=row.parentElement;

return(row.rowIndex);

}

function initcolor()

{

for (i=1;i<element.rows.length;i++)

{

element.rows[i].style.backgroundColor=eval("color"+i%2);

for(j=0;j<element.rows[i].cells.length;j++)

{

for(k=0;k<element.rows[i].cells[j].childNodes.length;k++)

{

if(element.rows[i].cells[j].childNodes[k].style!=undefined)

element.rows[i].cells[j].childNodes[k].style.backgroundColor=eval("color"+i%2);

}

}

}

}

function lightcolor(ln)

{

i=ln;

element.rows[i].style.backgroundColor="#33FFFF";

for(j=0;j<element.rows[i].cells.length;j++)

{

for(k=0;k<element.rows[i].cells[j].childNodes.length;k++)

{

if(element.rows[i].cells[j].childNodes[k].style!=undefined)

element.rows[i].cells[j].childNodes[k].style.backgroundColor="#33FFFF";

}

}

}

function addnew(line)

{

ln=(line==null||line=="[object]")?element.rows.length:line;

element.insertRow();

for(i=0;i<element.td_count;i++)

{

element.rows[ln].insertCell();

}

element.rows[ln].style.cssText=element.tr_cssText;

element.rows[ln].className=element.tr_className;

restoreEvent("element.rows["+ln+"]","TR");

cell=element.rows[ln].cells;

for(i=0;i<cell.length;i++)

{

cell[i].innerHTML=eval("element.td_innerHTML"+i);

cell[i].style.cssText=eval("element.td_cssText"+i);

restoreEvent("element.rows["+ln+"].cells["+i+"]","TD"+i);

}

initcolor();

t=element

t.rows[ln].attachEvent("onclick",lighton);

t.rows[ln].style.cursor="default";

t.rows[ln].cells[0].style.backgroundColor=element.delcolor;

t.rows[ln].cells[0].style.cursor="hand";

t.rows[ln].cells[0].attachEvent("onclick",delit);

t.rows[ln].cells[0].attachEvent("onmouseover",delmouseover);

t.rows[ln].cells[0].attachEvent("onmouseout",delmouseout);

}

function copyEvent(tfrom,tto,str1,str2,xxx)

{

eval(tto+"."+str2+"onactivate="+tfrom+"."+str1+"onactivate");

eval(tto+"."+str2+"onbeforeupdate="+tfrom+"."+str1+"onbeforeupdate");

eval(tto+"."+str2+"onblur="+tfrom+"."+str1+"onblur");

eval(tto+"."+str2+"oncellchange="+tfrom+"."+str1+"oncellchange");

eval(tto+"."+str2+"onchange="+tfrom+"."+str1+"onchange");

eval(tto+"."+str2+"onclick="+tfrom+"."+str1+"onclick");

eval(tto+"."+str2+"oncontextmenu="+tfrom+"."+str1+"oncontextmenu");

eval(tto+"."+str2+"oncontrolselect="+tfrom+"."+str1+"oncontrolselect");

eval(tto+"."+str2+"oncopy="+tfrom+"."+str1+"oncopy");

eval(tto+"."+str2+"oncut="+tfrom+"."+str1+"oncut");

eval(tto+"."+str2+"ondblclick="+tfrom+"."+str1+"ondblclick");

eval(tto+"."+str2+"ondeactivate="+tfrom+"."+str1+"ondeactivate");

eval(tto+"."+str2+"ondrag="+tfrom+"."+str1+"ondrag");

eval(tto+"."+str2+"ondragend="+tfrom+"."+str1+"ondragend");

eval(tto+"."+str2+"ondragenter="+tfrom+"."+str1+"ondragenter");

eval(tto+"."+str2+"ondragleave="+tfrom+"."+str1+"ondragleave");

eval(tto+"."+str2+"ondragover="+tfrom+"."+str1+"ondragover");

eval(tto+"."+str2+"ondragstart="+tfrom+"."+str1+"ondragstart");

eval(tto+"."+str2+"ondrop="+tfrom+"."+str1+"ondrop");

eval(tto+"."+str2+"onerrorupdate="+tfrom+"."+str1+"onerrorupdate");

eval(tto+"."+str2+"onfilterchange="+tfrom+"."+str1+"onfilterchange");

eval(tto+"."+str2+"onfocus="+tfrom+"."+str1+"onfocus");

eval(tto+"."+str2+"onhelp="+tfrom+"."+str1+"onhelp");

eval(tto+"."+str2+"onkeydown="+tfrom+"."+str1+"onkeydown");

eval(tto+"."+str2+"onkeypress="+tfrom+"."+str1+"onkeypress");

eval(tto+"."+str2+"onkeyup="+tfrom+"."+str1+"onkeyup");

eval(tto+"."+str2+"onmousedown="+tfrom+"."+str1+"onmousedown");

eval(tto+"."+str2+"onmouseenter="+tfrom+"."+str1+"onmouseenter");

eval(tto+"."+str2+"onmouseleave="+tfrom+"."+str1+"onmouseleave");

eval(tto+"."+str2+"onmousemove="+tfrom+"."+str1+"onmousemove");

eval(tto+"."+str2+"onmouseout="+tfrom+"."+str1+"onmouseout");

eval(tto+"."+str2+"onmouseup="+tfrom+"."+str1+"onmouseup");

eval(tto+"."+str2+"onmouseover="+tfrom+"."+str1+"onmouseover");

eval(tto+"."+str2+"onmove="+tfrom+"."+str1+"onmove");

eval(tto+"."+str2+"onmoveend="+tfrom+"."+str1+"onmoveend");

eval(tto+"."+str2+"onmovestart="+tfrom+"."+str1+"onmovestart");

eval(tto+"."+str2+"onpage="+tfrom+"."+str1+"onpage");

eval(tto+"."+str2+"onpaste="+tfrom+"."+str1+"onpaste");

eval(tto+"."+str2+"onresize="+tfrom+"."+str1+"onresize");

eval(tto+"."+str2+"onresizeend="+tfrom+"."+str1+"onresizeend");

eval(tto+"."+str2+"onresizestart="+tfrom+"."+str1+"onresizestart");

eval(tto+"."+str2+"onrowenter="+tfrom+"."+str1+"onrowenter");

eval(tto+"."+str2+"onrowexit="+tfrom+"."+str1+"onrowexit");

eval(tto+"."+str2+"onrowsdelete="+tfrom+"."+str1+"onrowsdelete");

eval(tto+"."+str2+"onrowsinserted="+tfrom+"."+str1+"onrowsinserted");

eval(tto+"."+str2+"onscroll="+tfrom+"."+str1+"onscroll");

eval(tto+"."+str2+"onselect="+tfrom+"."+str1+"onselect");

eval(tto+"."+str2+"onselectstart="+tfrom+"."+str1+"onselectstart");

}

function restoreEvent(tto,str)

{

copyEvent("element",tto,str,"",1);

}

function backupEvent(tfrom,str)

{

copyEvent(tfrom,"element","",str);

}

</script>

<!--***********************dtable.htm******************************-->

<LINK href="cb2.css" type=text/css rel=stylesheet>

<style type="text/css">

.t{behavior:url(dtable.htc)}

</style>

<!-- Start Defining the menu -->

<TABLE class="t" id=tableid cellpadding=0 cellspacing=0 border=0>

<tr>

<TD>X</TD>

<TD>表格表哥</TD> <TD>表格表哥</TD> <TD>表格表哥</TD> <TD>表格表哥</TD>

</TR>

<tr>

<TD>X</TD>

<TD><INPUT TYPE="text" NAME="表格表哥"></TD>

<TD><SELECT NAME="">表格表哥</SELECT></TD>

<TD><INPUT TYPE="radio" NAME=""></TD>

<TD><INPUT TYPE="submit"></TD>

</TR>

</TABLE>

<INPUT TYPE="submit" onclick="javascript:document.all.tableid.addnew()" value=添加一行>

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有