微博输入相关js 代码

浏览数：20 / 时间：2015年06月09日

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>微博发布</title>
<style>
body{ font-size:12px;}
#div1{ width:400px; margin:20px auto;}
#div1 p{ float:right; margin:0;}
#div1 textarea{ width:400px; height:100px;}
#div1 a{ width:50px; height:30px; font-size:16px; line-height:30px; text-align:center; float:right; background:#00FF00; color:#FFFFFF;}
#div1 a.dis{ background:#CCCCCC; color:#666666;}
</style>

<script>

//onchange : 当光标消失的时候，只能触发一次

//ie : onpropertychange : 输入连续触发
//标准：oninput : 也是连续触发


window.onload = function(){
    var OT = document.getElementsByTagName(‘textarea‘)[0];
    var Ospan = document.getElementsByTagName(‘span‘)[0];
    var Oa = document.getElementsByTagName(‘a‘)[0];
    
    var str = null;
    if(!+[1,]){  // 判断是不是ie 浏览器
      OT.onpropertychange = ontext_cli;
    } else {
       OT.oninput = ontext_cli;
    }
         
    function ontext_cli(){
          if(OT.value == ‘‘|| OT.value.length > 140){
                Oa.className = ‘dis‘;
          }else{
            Oa.className = ‘‘;
          }
        var num = Math.ceil(getLength(OT.value)/2);
        if(!Ospan){
          return
          }
        
        if(num<=140){
            Ospan.innerHTML = 140 - num;
            Ospan.style.color = ‘‘;
        }
        else{
            Ospan.innerHTML = num - 140;
            Ospan.style.color = ‘red‘;
        }
    }
          
            
    function getLength(str){
        return String(str).replace(/[^\x00-\xff]/g,‘aa‘).length;
    }  
    //      
    OT.onfocus = function(){
        Ospan.innerHTML = ‘140‘;
    }
    OT.onblur = function(){
        Ospan.innerHTML = ‘‘;
    }      

}

</script>
</head>

<body>
<div id="div1">
    <p>《新浪微博社区公约(征求意见稿)》意见征求</p><span></span>
    <textarea></textarea>
    <a class="dis" href="javascript:;">发布</a>
</div>
</body>
</html>