BlogJava-tambc-文章分类-JavaScripthttp://www.blogjava.net/tambc/category/18608.htmlzh-cnWed, 28 Feb 2007 03:41:02 GMTWed, 28 Feb 2007 03:41:02 GMT60Ajax客户端发起的禁止使用Cache的指令http://www.blogjava.net/tambc/articles/89244.htmltambctambcThu, 21 Dec 2006 03:48:00 GMThttp://www.blogjava.net/tambc/articles/89244.htmlhttp://www.blogjava.net/tambc/comments/89244.htmlhttp://www.blogjava.net/tambc/articles/89244.html#Feedback0http://www.blogjava.net/tambc/comments/commentRss/89244.htmlhttp://www.blogjava.net/tambc/services/trackbacks/89244.html xmlhttp.setRequestHeader( " If-Modified-Since " , " 0 " );

tambc 2006-12-21 11:48 发表评论
]]>防止Combox浮在最上层的方法http://www.blogjava.net/tambc/articles/89242.htmltambctambcThu, 21 Dec 2006 03:45:00 GMThttp://www.blogjava.net/tambc/articles/89242.htmlhttp://www.blogjava.net/tambc/comments/89242.htmlhttp://www.blogjava.net/tambc/articles/89242.html#Feedback0http://www.blogjava.net/tambc/comments/commentRss/89242.htmlhttp://www.blogjava.net/tambc/services/trackbacks/89242.html图片：

< BODY  style =font-size:12 >  
下拉选择框： 

 < select  style =width:200 >  
　  < option > 经过rebuild的下拉选择框1 </ option >  
  < option > 经过rebuild的下拉选择框2 </ option >  
  < option > 经过rebuild的下拉选择框3 </ option >  
  < option > 经过rebuild的下拉选择框4 </ option >  
  < option > 经过rebuild的下拉选择框5 </ option >  
 </ select >  
 < div  align =center  style ="position: absolute; line-height: 200px; left: 91; top: 39; width: 300; height: 202; background-color: #d4d0c8; background-repeat: repeat; background-attachment: scroll; border: 1px solid #808080; background-position: 0%" > 层模拟的对话框或菜单 </ div >  
 </ BODY >  
 < script >  
selRebuild() 
 function  selRebuild() { 
　　 var  l,i,j,w,h,ol,sel,tx,bx 
　　 if ( ! document.all) 
　　　　 return  
　　ol = document.getElementsByTagName( " select " ) 
　　 for (i = 0 ;i < ol.length;i ++ ) { 
　　　　sel = ol[i] 
　　　　 if (sel.rebuild == 1 ) 
　　　　　　 continue  
　　　　sel.rebuild = 1  
　　　　sel.w = sel.offsetWidth 
　　　　sel.style.display = " none "  
　　　　l = " <input readonly onmouseup=this.style.backgroundPositionY=0 "  
　　　　l += "  style=’width: " + sel.w + " ;height:21px;background:url(41.gif) right top no-repeat’> "  
　　　　l += " <div onmousedown=event.cancelBubble=true style=position:absolute;cursor:default></div> "  
　　　　sel.insertAdjacentHTML( " afterend " ,l) 
　　　　tx = sel.nextSibling 
　　　　 if (sel.length > 0 ) 
　　　　　　tx.value = sel.options[sel.selectedIndex].text 
　　　　bx = tx.nextSibling 
　　　　bx.sel = sel 
　　　　document.body.previousSibling 
　　　　tx.onmousedown = function () { 
　　　　　　 var  tx = this ,sel = tx.previousSibling,bx = tx.nextSibling 
　　　　　　 if (window.$bxSelectOption != null ) 
　　　　　　　　window.$bxSelectOption.innerHTML = ""  
　　　　　　tx.style.backgroundPositionY =- 17  
　　　　　　h = bx.sel.options.length * 15 + 3  
　　　　　　 if (h <= 2 || h > 167 ) 
　　　　　　　　h = 167  
　　　　　　 
　　　　　　l = " <div style=’position:absolute;left:- " + sel.w + " ;top:22;width: " + sel.w + " ;height: " + h + " ;background:white;border:1px solid black;overflow:auto’> "  
　　　　　　l += " <table onselectstart=return(false) cellpadding=0 cellspacing=0 style=width:100%;font-size:12> "  
　　　　　　 for (j = 0 ;j < sel.length;j ++ ) { 
　　　　　　　　l += " <tr height=15 onclick=this.parentNode.parentNode.parentNode.parentNode.optionClick() "  
　　　　　　　　l += "  onmouseover=this.parentNode.parentNode.parentNode.parentNode.optionMove(this.rowIndex)> "  
　　　　　　　　l += " <td valign=bottom style=padding-left:2> " + sel.options[j].text + " </td></tr> "  
　　　　　　}  
　　　　　　l += " </table></div> "  
　　　　　　bx.innerHTML = l 
　　　　　　window.$bxSelectOption = bx 
　　　　　　 if (bx.sel.length > 0 ) 
　　　　　　　　bx.optionMove(bx.sel.selectedIndex) 
　　　　　　event.cancelBubble = true  
　　　　}  
　　　　bx.optionMove = function (index) { 
　　　　　　 var  bx = this ,tb 
　　　　　　tb = bx.children[ 0 ].children[ 0 ] 
　　　　　　 if (tb.selIndex != null ) 
　　　　　　　　tb.rows[tb.selIndex].style.cssText = ""  
　　　　　　tb.selIndex = Math.min(index,tb.rows.length - 1 ) 
　　　　　　tb.rows[tb.selIndex].style.cssText = " background:#0A246A;color:white "  
　　　　}  
　　　　bx.optionClick = function () { 
　　　　　　 var  bx = this ,tx = bx.previousSibling,sel = tx.previousSibling,tb = bx.children[ 0 ].children[ 0 ] 
　　　　　　sel.selectedIndex = tb.selIndex 
　　　　　　tx.value = sel.options[sel.selectedIndex].text 
　　　　　　bx.innerHTML = ""  
　　　　　　 if (sel.onchange != null ) 
　　　　　　　　sel.onchange() 
　　　　}  
　　}  
　　document.body.attachEvent( " onmousedown " , function () { 
　　　　 if (window.$bxSelectOption != null ) 
　　　　　　window.$bxSelectOption.innerHTML = ""  
　　} ) 
}  
 function  selReset(sel) { 
　　 if ( ! document.all) 
　　　　 return  
　　 var  tx = sel.nextSibling 
　　tx.value = sel.options[sel.selectedIndex].text 
}  
 </ script >


tambc 2006-12-21 11:45 发表评论
]]>美化文件上传界面http://www.blogjava.net/tambc/articles/89241.htmltambctambcThu, 21 Dec 2006 03:41:00 GMThttp://www.blogjava.net/tambc/articles/89241.htmlhttp://www.blogjava.net/tambc/comments/89241.htmlhttp://www.blogjava.net/tambc/articles/89241.html#Feedback0http://www.blogjava.net/tambc/comments/commentRss/89241.htmlhttp://www.blogjava.net/tambc/services/trackbacks/89241.html  1 < head >  
  2 < style >  
  3 * { font-size : 12px ; cursor : default }  
  4 .hand { cursor : hand ; cursor : pointer }  
  5 </ style >  
  6 </ head >  
  7
 8 < body >  
  9 < form  name =fm1 >  
 10 < div  id =bxAttList >  
 11 　　 < div  id =bxAtt  onmouseover ="$(’bxAtt1’).style.textDecoration=’underline’"  onmouseout ="$(’bxAtt1’).style.textDecoration=’’"  style =float:left;width:60 >  
 12 　　　　 < span  id =bxAtt1  style =’position:absolute;padding-top:3;cursor:hand;font-family:宋体’ > @添加附件 </ span >  
 13 　　　　 < span  id =bxAtt2  onmouseover =this.scrollLeft=100  style =position:absolute;width:60;overflow:hidden;filter:alpha(opacity=0);-moz-opacity:0 ></ span >  
 14 　　 </ div >  
 15 </ div >  
 16 </ form >  
 17 </ body >  
 18 < script >  
 19 file_create() 
 20 function  file_create() { 
 21 　　$( " bxAtt2 " ).innerHTML = " <input onchange=file_change(this) hidefocus type=file name=file1 size=1 class=hand> "  
 22 }  
 23 function  file_change(tx) { 
 24 　　 var  sName,o 
 25 　　sName = tx.value.replace( / \\ / g, " / " ).replace( / (. * \ / )(. * ) / , " $2 " ) 
 26 　　o = document.createElement( " nobr " ) 
 27 　　o.style.cssText = " float:left;margin-right:6;padding-top:3;color:darkgreen "  
 28 　　o.innerHTML = " □ " + sName + " <font onclick=$(’bxAttList’).removeChild(this.parentNode);file_repos() class=hand style=color:red;font-weight:bold> " + unescape( " %d7 " ) + " </font> "  
 29 　　tx.style.display = " none "  
 30 　　o.appendChild(tx) 
 31 　　$( " bxAttList " ).insertBefore(o,$( " bxAtt " )) 
 32 　　file_repos() 
 33 　　file_create() 
 34 }  
 35 function  file_repos() { 
 36 　　$( " bxAttList " ).appendChild($( " bxAtt " )) 
 37 }  
 38 function  $(obj) { 
 39 　　 return   typeof (obj) == " object " ? obj:document.getElementById(obj) 
 40 }  
 41 </ script >

tambc 2006-12-21 11:41 发表评论
]]>在WEB页中实现表头表脚和打印分页http://www.blogjava.net/tambc/articles/89239.htmltambctambcThu, 21 Dec 2006 03:40:00 GMThttp://www.blogjava.net/tambc/articles/89239.htmlhttp://www.blogjava.net/tambc/comments/89239.htmlhttp://www.blogjava.net/tambc/articles/89239.html#Feedback0http://www.blogjava.net/tambc/comments/commentRss/89239.htmlhttp://www.blogjava.net/tambc/services/trackbacks/89239.html 

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >  
 < html >  
 < head >  
 < meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >  
 < title > 无标题文档 </ title >  
 < style >  
@media print {  
INPUT {display : none }  
} 
 </ style >  
 </ head >  

 < body >  

 < TABLE  border ="0"  style ="font-size:9pt;"  width ="300px"  align ="center" >  
 < THEAD  style ="display:table-header-group;font-weight:bold" >  
 < TR >< TD  colspan ="2"  align ="center"  style ="font-weight:bold;border:3px double red" > 每页都有的表头 </ TD ></ TR >  
 </ THEAD >  
 < TBODY  style ="text-align:center" " >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR  style ="page-break-after:always;" >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR  style ="page-break-after:always;" >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 < TR  style ="page-break-after:always;" >< TD > 表格内容 </ TD >< TD > 表格内容 </ TD ></ TR >  
 </ TBODY >  
 < TFOOT  style ="display:table-footer-group;font-weight:bold" >  
 < TR >  
 < TD  colspan ="2"  align ="center"  style ="font-weight:bold;border:3px double blue" > 每页都有的表尾 </ TD >  
 </ TR >  
 </ TFOOT >  
 </ TABLE >  
 < input  type =button  value =" 打  印 "  onclick =javascript:window.print() >  
 </ body >  
 </ html >


tambc 2006-12-21 11:40 发表评论
]]>textarea控制字符数http://www.blogjava.net/tambc/articles/89238.htmltambctambcThu, 21 Dec 2006 03:39:00 GMThttp://www.blogjava.net/tambc/articles/89238.htmlhttp://www.blogjava.net/tambc/comments/89238.htmlhttp://www.blogjava.net/tambc/articles/89238.html#Feedback0http://www.blogjava.net/tambc/comments/commentRss/89238.htmlhttp://www.blogjava.net/tambc/services/trackbacks/89238.html1.能够实时判断输入的字节数
2.能够自动裁减超过最大长度后的内容
3.对粘贴进来的内容一样有效
4.对用鼠标拖曳进来的内容也一样有效
5.正则表达式的应用和程序的构想

源码：

<script>
function checklen(obj){
var lenE = obj.value.length;
var lenC = 0;
var CJK = obj.value.match(/[\u4E00-\u9FA5\uF900-\uFA2D]/g);
if (CJK != null) lenC += CJK.length;
tno.innerText = obj.maxlength - lenC - lenE ;
if (tno.innerText < 0) {
var tmp = 0
var cut = obj.value.substring(0, obj.maxlength);
for (var i=0; i<cut.length; i++){
tmp += /[\u4E00-\u9FA5\uF900-\uFA2D]/.test(cut.charAt(i)) ? 2 : 1;
if (tmp > obj.maxlength) break;
}
obj.value = cut.substring(0, i);
}
}
</script>
<body onload="tno.innerText = s1.maxlength;">
<textarea name="s1" rows="5" cols="50" maxlength="1000" onpropertychange="checklen(this)"></textarea>
剩余<span id="tno"></span>个字符

tambc 2006-12-21 11:39 发表评论
]]>文件上传前台控制检测程序http://www.blogjava.net/tambc/articles/89237.htmltambctambcThu, 21 Dec 2006 03:36:00 GMThttp://www.blogjava.net/tambc/articles/89237.htmlhttp://www.blogjava.net/tambc/comments/89237.htmlhttp://www.blogjava.net/tambc/articles/89237.html#Feedback0http://www.blogjava.net/tambc/comments/commentRss/89237.htmlhttp://www.blogjava.net/tambc/services/trackbacks/89237.html阅读全文

tambc 2006-12-21 11:36 发表评论
]]>