|
![]() |
名片设计 CorelDRAW Illustrator AuotoCAD Painter 其他软件 Photoshop Fireworks Flash |
|
这是一个动态增加删除物件如(Text,Table)的例子, 它的特点是可以不提交到后台, 直接在前台物件中保存数据.需要时,一起提交. 在ASP中这样可以省去很多没有必要的送到后台处理. 很有用.我想了一天才出来. 这里用到了一个链表的概念,就是TableA+DivA DivA--->存放TableB+DivB DivB--->存放TableC+DivC ....... 源码如下: <html> <head> <meta http-equiv="content-Type" content="text/html"> <title>Dhtml test</title> <style type="text/css"> A { COLOR: royalblue; FONT-SIZE:9PT; TEXT-DECORATION: none } A:hover { COLOR:indigo; FONT-SIZE:9PT; TEXT-DECORATION: none } TD { COLOR: black; FONT-FAMILY: 敷灿??砰; FONT-SIZE: 9pt; FONT-WEIGHT: 400 } </style> </head> <BODY > <center><b>动态增加删除物件</b></center> <DIV id="mybag0" ALIGN="CENTER"> <!--在这里是开始加入第一个--> </DIV> <DIV ALIGN="CENTER"> <TABLE WIDTH="100%" BORDER="1" CELLSPACING="1" CELLPADDING="1" BORDERCOLOR="tomato"> <tr> <td colspan="16" align="center"> <input type="button" name="cmdAddItm" value="add" onclick="AddItm();"> <input type="button" name="cmdDelItm" value="Del" onclick="DelItm();"> </td> </tr> </TABLE> </DIV> </BODY> <script language="JavaScript" src="function/function.js"> </script> <script language= "javascript"> //\\\'********************************************************* // \\\' Purpose: Table TblItm1,TblItm2,TblItm3....... // \\\' Inputs: //\\\' Returns: True,False //\\\'********************************************************* var StraddItem=""; var ItemNo=1; //,1,2,3,4...... function AddItm() { var mybag="Mybag"+(ItemNo-1); //look for last Bag //StraddItem=Table+define new Bag StraddItem="<table id=TblItm"+ItemNo+" WIDTH=100% BORDER=0 CELLSPACING=1 CELLPADDING=1 BORDERCOLOR=red><TR><TD COLSPAN=6 > </TD></TR><tr colspan=6 height=1align=center> <td align=center colspan=13 width=100% bgcolor=mistyrose> <INPUT TYPE=CHECKBOX name=chkAppIt"+ ItemNo +" value=Y>"+ ItemNo +".Table <input type=text name=txtAppit"+ ItemNo + " size=35> </td> </tr> <TR><TD COLSPAN=6 > </TD></TR></table><div id=mybag"+ItemNo+" > </div>"; //将(Table+define new Bag)放入上一个袋囊,形成链表 document.all(mybag).innerHTML=StraddItem; ItemNo++; } //************************* *********************************** //\\\'********************************************************* // \\\' Purpose: Del()Table TblItm1,TblItm2,TblItm3....... // \\\' Inputs: //\\\' Returns: True,False //\\\'********************************************************* function DelItm() { var i; var bSel; var strURL; for(i=1;i<ItemNo;i++) //chkAppitx, forbidden Show TblItmx { chkAppItx="chkAppIt"+i; TblItmx="TblItm"+i; if (document.all(chkAppItx).checked==true) {document.all(TblItmx).style.display="none" bSel=true; } } if (bSel != true) {alert("must choose Del items∩") ; return false; } else return true; } //\\\'********************************************************* </script> </html> 返回类别: 教程 上一教程: 用ASP制作饼图、柱状图等 下一教程: 相对路径产生JS文件、HTML文件 您可以阅读与"动态增加\删除物件如(TEXT,TABLE)的例子"相关的教程: · 动态的在页面上增加或删除一个文本框 · 三层动态下拉菜单的例子 · 动态增加表单元素 · ASP删除非空目录的例子 · 一个简朴的网上书城的例子(八) |
![]() ![]() |
快精灵印艺坊 版权所有 |
首页![]() ![]() ![]() ![]() ![]() ![]() ![]() |