javascript 常用代码大全（七）

 

// 11

一段实现DataGrid的“编辑”、“取消”功能脚本，目的是不产生页面刷新 
<SCRIPT language="javascript"> 
var selectRow=""; 
var selectObject; 
function EditCell(thisObject,type) 
{ 
var id = thisObject.id; 
var buttonID="Button"+type; 
var row=id.replace(buttonID,""); 
if(type==1&&selectRow.length>0&&selectObject!=null) 
{ 
EditRow(selectRow,2,selectObject); 
selectRow=""; 
} 
if(type==1){selectRow=row;selectObject=thisObject;}else{selectRow="";selectObject=null;} 
EditRow(row,type,thisObject); 
} 
function EditRow(row,type,thisObject) 
{ 
var visible1="none"; 
var visible2="inline"; 
if(type!=1) 
{ 
visible1="inline"; 
visible2="none"; 
} 
var buttonID="Button"+type; 
var style; 
var i; 
for(i=1;i<8;i++) 
{ 
var name1=row+"Img"+i; 
document.all[name1].getAttribute("style").display=visible1; 
name1=row+"Text"+i; 
var name2=row+"Checkbox"+i; 
document.all[name2].getAttribute("style").display=visible2; 
if(type!=1) 
{ 
if(document.all[name1].value==1) 
document.all[name2].checked=true; 
else 
document.all[name2].checked=false; 
} 
} 
var tdIndex = thisObject.parentElement.cellIndex; 
if(type>1) tdIndex = tdIndex -1; 
thisObject.parentElement.parentElement.cells[tdIndex].getAttribute("style").display=visible2; 
thisObject.parentElement.colSpan=type; 
var name; 
name=row+buttonID; 
document.all[name].getAttribute("style").display="none"; 
if(type==1) 
{ 
document.all[name].parentElement.parentElement.getAttribute("style").backgroundColor="LightYellow"; 
name=row+"Button2"; 
document.all[name].getAttribute("style").display="inline"; 
} 
else 
{ 
document.all[name].parentElement.parentElement.getAttribute("style").backgroundColor=""; 
name=row+"Button1"; 
document.all[name].getAttribute("style").display="inline"; 
} 
} 
</SCRIPT> 
<asp:datagrid id="GridItem" runat="server" cellPadding="0" BorderStyle="Solid" AutoGenerateColumns="False" 
Width="100%" AllowPaging="True"> 
<SelectedItemStyle BackColor="LightYellow"></SelectedItemStyle> 
<EditItemStyle CssClass="tdbg-dark" BackColor="Ivory"></EditItemStyle> 
<ItemStyle HorizontalAlign="Center" Height="23px" CssClass="tdbg"></ItemStyle> 
<HeaderStyle HorizontalAlign="Center" Height="25px" CssClass="summary-title"></HeaderStyle> 
<Columns> 
<asp:BoundColumn DataField="id" ReadOnly="True" HeaderText="人员编号"> 
<HeaderStyle Width="120px"></HeaderStyle> 
</asp:BoundColumn> 
<asp:BoundColumn ReadOnly="True" HeaderText="姓名"> 
<HeaderStyle Width="120px"></HeaderStyle> 
</asp:BoundColumn> 
<asp:TemplateColumn HeaderText="管理权"> 
<HeaderStyle Width="60px"></HeaderStyle> 
<ItemTemplate> 
<IMG id="Img1" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server">
<INPUT id="Checkbox1" style="DISPLAY: none" type="checkbox" runat="server"> 
<INPUT id="Text1" type="text" runat="server" style="DISPLAY: none"> 
</ItemTemplate> 
</asp:TemplateColumn> 
<asp:TemplateColumn HeaderText="查询权"> 
<HeaderStyle Width="60px"></HeaderStyle> 
<ItemTemplate> 
<IMG id="Img2" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server">
<INPUT id="Checkbox2" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox2"> 
<INPUT id="Text2" type="text" runat="server" style="DISPLAY: none" NAME="Text2"> 
</ItemTemplate> 
</asp:TemplateColumn> 
<asp:TemplateColumn HeaderText="录入权"> 
<HeaderStyle Width="60px"></HeaderStyle> 
<ItemTemplate> 
<IMG id="Img3" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server">
<INPUT id="Checkbox3" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox3"> 
<INPUT id="Text3" type="text" runat="server" style="DISPLAY: none" NAME="Text3"> 
</ItemTemplate> 
</asp:TemplateColumn> 
<asp:TemplateColumn HeaderText="修改权"> 
<HeaderStyle Width="60px"></HeaderStyle> 
<ItemTemplate> 
<IMG id="Img4" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server">
<INPUT id="Checkbox4" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox4"> 
<INPUT id="Text4" type="text" runat="server" style="DISPLAY: none" NAME="Text4"> 
</ItemTemplate> 
</asp:TemplateColumn> 
<asp:TemplateColumn HeaderText="删除权"> 
<HeaderStyle Width="60px"></HeaderStyle> 
<ItemTemplate> 
<IMG id="Img5" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server">
<INPUT id="Checkbox5" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox5"> 
<INPUT id="Text5" type="text" runat="server" style="DISPLAY: none" NAME="Text5"> 
</ItemTemplate> 
</asp:TemplateColumn> 
<asp:TemplateColumn HeaderText="导出权"> 
<HeaderStyle Width="60px"></HeaderStyle> 
<ItemTemplate> 
<IMG id="Img6" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server">
<INPUT id="Checkbox6" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox6"> 
<INPUT id="Text6" type="text" runat="server" style="DISPLAY: none" NAME="Text6"> 
</ItemTemplate> 
</asp:TemplateColumn> 
<asp:TemplateColumn HeaderText="导入权"> 
<HeaderStyle Width="60px"></HeaderStyle> 
<ItemTemplate> 
<IMG id="Img7" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server">
<INPUT id="Checkbox7" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox7"> 
<INPUT id="Text7" type="text" runat="server" style="DISPLAY: none" NAME="Text7"> 
</ItemTemplate> 
</asp:TemplateColumn> 
<asp:ButtonColumn Text="保存" HeaderText="操作" CommandName="cmdSave"> 
<ItemStyle Font-Size="10pt"></ItemStyle> 
</asp:ButtonColumn> 
<asp:TemplateColumn> 
<ItemTemplate> 
<INPUT id="Button1" style="cursor: hand; WIDTH: 35px; COLOR: blue; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-COLOR: transparent; TEXT-DECORATION: underline; BORDER-BOTTOM-STYLE: none" 
onclick="EditCell(this,1);" type="button" value="编辑" runat="server"><INPUT id="Button2" style="cursor: hand; DISPLAY: none; COLOR: blue; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-COLOR: transparent; TEXT-DECORATION: underline; BORDER-BOTTOM-STYLE: none" 
onclick="EditCell(this,2);" type="button" value="取消" runat="server"> 
</ItemTemplate> 
</asp:TemplateColumn> 
</Columns> 
<PagerStyle NextPageText="下一页" PrevPageText="上一页"></PagerStyle> 
</asp:datagrid> 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> DSTree </TITLE> 
<META NAME="Author" CONTENT="[e-mail]" > 
<style> 
body,td{font:12px verdana} 
#treeBox{background-color:#fffffa;} 
#treeBox .ec{margin:0 5 0 5;} 
#treeBox .hasItems{font-weight:bold;height:20px;padding:3 6 0 6;margin:2px;cursor:hand;color:#555555;border:1px solid #fffffa;} 
#treeBox .Items{height:20px;padding:3 6 0 6;margin:1px;cursor:hand;color:#555555;border:1px solid #fffffa;} 
</style> 
<base href="http://vip.5d.cn/star/dstree/" /> 
<script> 
//code by star 20003-4-7 
var HC = "color:#990000;border:1px solid #cccccc"; 
var SC = "background-color:#efefef;border:1px solid #cccccc;color:#000000;"; 
var IO = null; 
function initTree(){ 
var rootn = document.all.menuXML.documentElement; 
var sd = 0; 
document.onselectstart = function(){return false;} 
document.all.treeBox.appendChild(createTree(rootn,sd)); 
} 
function createTree(thisn,sd){ 
var nodeObj = document.createElement("span"); 
var upobj = document.createElement("span"); 
with(upobj){ 
style.marginLeft = sd*10; 
className = thisn.hasChildNodes()?"hasItems":"Items"; 
innerHTML = "<img src=http://www.blueidea.com/img/common/logo.gif class=ec>" + thisn.getAttribute("text") +""; 
onmousedown = function(){ 
if(event.button != 1) return; 
if(this.getAttribute("cn")){ 
this.setAttribute("open",!this.getAttribute("open")); 
this.cn.style.display = this.getAttribute("open")?"inline":"none"; 
this.all.tags("img")[0].src = this.getAttribute("open")?"http://www.blueidea.com/img/common/logo.gif":"http://www.blueidea.com/img/common/logo.gif"; 
} 
if(IO){ 
IO.runtimeStyle.cssText = ""; 
IO.setAttribute("selected",false); 
} 
IO = this; 
this.setAttribute("selected",true); 
this.runtimeStyle.cssText = SC; 
} 
onmouseover = function(){ 
if(this.getAttribute("selected"))return; 
this.runtimeStyle.cssText = HC; 
} 
onmouseout = function(){ 
if(this.getAttribute("selected"))return; 
this.runtimeStyle.cssText = ""; 
} 
oncontextmenu = contextMenuHandle; 
onclick = clickHandle; 
} 
if(thisn.getAttribute("treeId") != null){ 
upobj.setAttribute("treeId",thisn.getAttribute("treeId")); 
} 
if(thisn.getAttribute("href") != null){ 
upobj.setAttribute("href",thisn.getAttribute("href")); 
} 
if(thisn.getAttribute("target") != null){ 
upobj.setAttribute("target",thisn.getAttribute("target")); 
} 
nodeObj.appendChild(upobj); 
nodeObj.insertAdjacentHTML("beforeEnd","<br/>") 
if(thisn.hasChildNodes()){ 
var i; 
var nodes = thisn.childNodes; 
var cn = document.createElement("span"); 
upobj.setAttribute("cn",cn); 
if(thisn.getAttribute("open") != null){ 
upobj.setAttribute("open",(thisn.getAttribute("open")=="true")); 
upobj.getAttribute("cn").style.display = upobj.getAttribute("open")?"inline":"none"; 
if( !upobj.getAttribute("open"))upobj.all.tags("img")[0].src ="http://www.blueidea.com/img/common/logo.gif"; 
} 
for(i=0;i<nodes.length;cn.appendChild(createTree(nodes[i++],sd+1))); 
nodeObj.appendChild(cn); 
} 
else{ 
upobj.all.tags("img")[0].src ="http://www.blueidea.com/img/common/logo.gif"; 
} 
return nodeObj; 
} 
window.onload = initTree; 
</script> 
<script> 
function clickHandle(){ 
// your code here 
} 
function contextMenuHandle(){ 
event.returnValue = false; 
var treeId = this.getAttribute("treeId"); 
// your code here 
} 
</script> 
</HEAD> 
<BODY> 
<xml id=menuXML> 
<?xml version="1.0" encoding="GB2312"?> 
<DSTreeRoot text="根节点" open="true" href="http://" treeId="123"> 
<DSTree text="技术论坛" open="false" treeId=""> 
<DSTree text="5DMedia" open="false" href="http://" target="box" treeId="12"> 
<DSTree text="网页编码" href="http://" target="box" treeId="4353" /> 
<DSTree text="手绘" href="http://" target="box" treeId="543543" /> 
<DSTree text="灌水" href="http://" target="box" treeId="543543" /> 
</DSTree> 
<DSTree text="BlueIdea" open="false" href="http://" target="box" treeId="213"> 
<DSTree text="DreamWeaver &amp; JS" href="http://" target="box" treeId="4353" /> 
<DSTree text="FlashActionScript" href="http://" target="box" treeId="543543" /> 
</DSTree> 
<DSTree text="CSDN" open="false" href="http://" target="box" treeId="432"> 
<DSTree text="JS" href="http://" target="box" treeId="4353" /> 
<DSTree text="XML" href="http://" target="box" treeId="543543" /> 
</DSTree> 
</DSTree> 
<DSTree text="资源站点" open="false" treeId=""> 
<DSTree text="素材屋" href="http://" target="box" treeId="12" /> 
<DSTree text="桌面城市" open="false" href="http://" target="box" treeId="213"> 
<DSTree text="壁纸" href="http://" target="box" treeId="4353" /> 
<DSTree text="字体" href="http://" target="box" treeId="543543" /> 
</DSTree> 
<DSTree text="MSDN" open="false" href="http://" target="box" treeId="432"> 
<DSTree text="DHTML" href="http://" target="box" treeId="4353" /> 
<DSTree text="HTC" href="http://" target="box" treeId="543543" /> 
<DSTree text="XML" href="" target="box" treeId="2312" /> 
</DSTree> 
</DSTree> 
</DSTreeRoot> 
</xml> 
<table style="position:absolute;left:100;top:100;"> 
<tr><td id=treeBox style="width:400px;height:200px;border:1px solid #cccccc;padding:5 3 3 5;"
valign=top></td></tr> 
<tr><td style="font:10px verdana;color:#999999" align=right>by
<font color=#660000>sTar</font><br/> 2003-4-8</td></tr> 
</table> 
</BODY> 
</HTML>