显示剩余可输入的数字

一、引入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>

 

posted @ 2016-01-07 15:32  小皮  阅读(146)  评论(0编辑  收藏  举报