显示剩余可输入的数字
一、引入css
1 .clsShowInfoWindow { 2 BORDER-RIGHT: #8AB3F4 3px solid; 3 PADDING-RIGHT: 0em; 4 BORDER-TOP: #8AB3F4 3px solid; 5 PADDING-LEFT: 0em; 6 FONT-SIZE: smaller; 7 font-family:Verdana, Arial, Helvetica; 8 font-size:12px; 9 Z-INDEX: 101; 10 PADDING-BOTTOM: 0em; 11 BORDER-LEFT: #8AB3F4 3px solid; 12 WIDTH: 260px; 13 COLOR: #000000; 14 PADDING-TOP: 0em; 15 BORDER-BOTTOM: #8AB3F4 3px solid; 16 position:absolute; 17 BACKGROUND-COLOR: #CEE0EB; 18 table-layout:fixed; 19 word-break:break-all 20 } 21 table.tableBorderStyle{ 22 BORDER-RIGHT: #ffffff 0px solid; 23 BORDER-TOP: #ffffff 0px solid; 24 BORDER-LEFT:#ffffff 0px; 25 BORDER-BOTTOM:#ffffff 0px; 26 margin:1; 27 text-align:center 28 } 29 td.tdBorderStyle{ 30 BORDER-RIGHT: #666666 1px solid; 31 BORDER-TOP: #666666 1px solid; 32 BORDER-LEFT:#666666 1px solid; 33 BORDER-BOTTOM:#666666 1px solid; 34 text-align:center 35 } 36 .scrollStyle{ 37 width:100%; 38 height:15px; 39 overflow:hidden; 40 vertical-align:middle; 41 text-align:left; 42 word-break:break-all; 43 word-wrap:break-word 44 }
二、引入js
1 /*firefox*/function __firefox(){ HTMLElement.prototype.__defineGetter__("runtimeStyle", __element_style); window.constructor.prototype.__defineGetter__("event", __window_event); Event.prototype.__defineGetter__("srcElement", __event_srcElement);}function __element_style(){ return this.style;}function __window_event(){ return __window_event_constructor();}function __event_srcElement(){ return this.target;}function __window_event_constructor(){ if(document.all){ return window.event; } var _caller = __window_event_constructor.caller; while(_caller!=null){ var _argument = _caller.arguments[0]; if(_argument){ var _temp = _argument.constructor; if(_temp.toString().indexOf("Event")!=-1){ return _argument; } } _caller = _caller.caller; } return null;}if(window.addEventListener){ __firefox();}/*end firefox*/ 2 3 function showInfoWithPanel(obj){ 4 try{ 5 //var e=event||window.event; 6 var showInfoWindow=document.getElementById("showInfomation"); 7 showInfoWindow.className="clsShowInfoWindow"; 8 showInfoWindow.style.visibility="visible"; 9 var x=document.body.scrollLeft+event.clientX+10; 10 var y=event.clientY+document.body.scrollTop+10;//+document.documentElement.scrollTop; 11 showInfoWindow.style.left=x; 12 showInfoWindow.style.top=y; 13 showInfoWindow.innerHTML=""; 14 showInfoWindow.innerHTML=obj.innerHTML;//+" clientY:"+y+" clientX:"+x; 15 obj.style.color="red"; 16 }catch(e){alert("showInfoWithPanel:"+e.message);} 17 } 18 function hiddenInfoPanel(obj){ 19 try{ 20 var showInfoWindow=document.getElementById("showInfomation"); 21 if(showInfoWindow || typeof(showInfoWindow)!='undefined'){ 22 showInfoWindow.innerHTML=""; 23 showInfoWindow.style.visibility="hidden"; 24 } 25 obj.style.color="#000000"; 26 }catch(e){alert("hiddenInfoPanel:"+e.message);} 27 }
三、使用在script中
1 function checkchar(){ 2 3 if(document.Form2.stationRun.value.length>2500){ 4 5 alert("站点运行情况字数不能超过2500字"); 6 return; 7 } 8 if(document.Form2.devRun.value.length>2500){ 9 10 alert("设备运行情况字数不能超过2500字"); 11 return; 12 } 13 document.Form2.action="commonMsgAction_saveMsg.do"; 14 loading(); 15 document.Form2.submit(); 16 alert(" 待办事宜保存成功!"); 17 } 18 function addEnter(element){ 19 document.getElementById(element).value = document.getElementById(element).value+"<br>"; 20 21 } 22 function checkTextAreaLen(){ 23 var stationRun = new Bs_LimitedTextarea('stationRun', 2500); 24 stationRun.infolineCssStyle = "font-family:arial; font-size:11px; color:gray;"; 25 stationRun.draw(); 26 27 var devRun = new Bs_LimitedTextarea('devRun', 2500); 28 devRun.infolineCssStyle = "font-family:arial; font-size:11px; color:gray;"; 29 devRun.draw(); 30 } 31 window.onload=function(){ 32 checkTextAreaLen(); 33 34 };
在body中使用
<div id="showInfomation" style="visibility: hidden"></div>
使用
addEnter('stationRun')函数
1 <textarea name="stationRun" id="stationRun" style="width: 500px; height: 160px; padding: 1;FONT-FAMILY: 宋体; FONT-SIZE: 9pt" onkeydown="if(event.keyCode==13)addEnter('stationRun');"><s:property value="stationRun" escapeXml="false"/></textarea>