初接触js。想实现一个简单功能(ps,还没想jquery。。):当textarea获得焦点,在div(id=“d”)显示当前输入字数, 当textarea失去焦点,隐藏
但是,获得焦点时,div木有显示显示想要的文本
<head>
 <title>--!</title>
 <script type="text/javascript">
 /*
 *当textarea获得焦点,显示当前输入字数
 *当textarea失去焦点,隐藏
 */
 //获得焦点,显示
 function show_count(){
  var mydiv = document.getElementById("d");
  var max = 90;
  var count = document.getElementById("area1").value.length;
  if(mydiv.value ==""||mydiv.value ==undefined)
   mydiv.innerHtml =count +"/" + max;
  mydiv.style.display = "block";
 } //失去焦点,隐藏
 function hidden_count(){
  document.getElementById("d").style.display = "none";
 } //textarea域改变,改变div文本
 function word_count(){
  var mydiv = document.getElementById("d");
  var max = 90;
  var count = document.getElementById("area1").value.length;
  if(count<max)
   mydiv.innerHtml = count +"/" + max;
  else
   document.getElementsByTagName("textarea")[0].value = document.getElementsByTagName("textarea")[0].value.substr(0,max);
 } function load(){  var text = document.getElementsByTagName("textarea")[0];
  //请空
  text.value = "";
  text.focus();
 }
 </script>
 <style type="text/css">
 #d{
  display: none;
  position: absolute;
  width: 50px;
  height: 14px;
  color: black;
  background: yellow;
 }
 </style>
</head>
<body>
 <form>
  <textarea onfocus="show_count()" onblur="hidden_count()" 
  onload="load()" 
   onpropertychange="word_count()" cols="60" rows="8" id="area1">123</textarea>
  <div id="d">mxl</div>
 </form>
</body>
</html>

解决方案 »

  1.   

    <!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>
    <script type="text/javascript">
     /*
     *当textarea获得焦点,显示当前输入字数
     *当textarea失去焦点,隐藏
     */
     
     
     //获得焦点,显示
     function show_count(){
      var mydiv = document.getElementById("d");
      var max = 90;
      var count = document.getElementById("area1").value.length;
      if(count>0){
        mydiv.innerHTML =count +"/" + max;
      }
      mydiv.style.display = "block";
     }
     
     //失去焦点,隐藏
     function hidden_count(){
      document.getElementById("d").style.display = "none";
     }
     
     //textarea域改变,改变div文本
     function word_count(){
      var mydiv = document.getElementById("d");
      var max = 90;
      var count = document.getElementById("area1").value.length;
      if(count<max)
       mydiv.innerHTML = count +"/" + max;
      else
       document.getElementsByTagName("textarea")[0].value = document.getElementsByTagName("textarea")[0].value.substr(0,max);
     }
     
     function load(){  var text = document.getElementsByTagName("textarea")[0];
      //请空
      text.value = "";
      text.focus();
     }
     </script>
     <style type="text/css">
     #d{
      display: none;
      position: absolute;
      width: 50px;
      height: 14px;
      color: black;
      background: yellow;
     }
     </style>
    </head><body>
    <form>
      <textarea onfocus="show_count()" onblur="hidden_count()" 
      onload="load()" 
       onkeyup="word_count()" cols="60" rows="8" id="area1">123</textarea>
      <div id="d">mxl</div>
     </form>
    </body>
    </html>
    这样试试  是innerHTML  拉
      

  2.   

    html对大小写不敏感。。js我也以为这样了。。谢谢了