none
没有updateplan,也没有ajax,用标签<font>实现局部更新? RRS feed

  • 问题

  • 今日要做个需求,文本框只让录入20个字,在旁边提示,还剩余几个,就跟腾讯微博一样。我发现页面上的字在没有刷新,也没有使用ajax的情况下更新了,感到奇怪,来问问,代码比较简单,不知道这算不算局部更新?这是<font>标签的特性?

    附上源码:

    <html>
    <head>
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    maxLen = 20; //定义用户可以输入的最多字数
    function checkMaxInput(obj) {
    if (obj.value.length > maxLen){ //如果输入的字数超过了限制
    obj.value = obj.value.substring(0, maxLen); //就去掉多余的字

    }
     remLen.innerText = '还剩下' + (maxLen - obj.value.length) + '字';
    }
    //  End -->
    </script>


    <title>倒计数文本框</title>
    </head>
    <body>
    <table border="1" width="40%" cellspacing="0" cellpadding="0"  height="0">
     <tr>
      <td width="100%"><b><font color=ffffff>倒计数文本框</font></b></td>
     </tr>
     <tr>
      <td width="100%" height="110">
       <form name=tickform>
        <p align="center">
         <textarea name=msgbox rows=5 cols=31 onKeyDown="checkMaxInput(this)" onKeyUp="checkMaxInput(this)"  ></textarea>
        </p>
       </td>
      </tr>
    </form>
     <tr>
      <td width="100%">
       <font align="right" id=remLen>还剩下20字</font>
      </td>
     </tr>
    </table>
    </body>
    </html>

    2012年7月12日 8:07

答案

  • 不明白,没说到根儿上,onKeyDown,onKeyUp只是个触发事件,但是 <font align="right" id=remLen>这块区域确实发生了更新啊。谁能把这个更新说明白。想听详细技术细节

    你给font起了一个id,注意在js中——

     remLen.innerText = '还剩下' + (maxLen - obj.value.length) + '字'; 

    这句话就是导致了font标签内部发生变化的原因。每次keydown,keyup都引发它重新赋值,因而font标签内部发生变化了。

    下载MSDN桌面工具(Vista,Win7)
    我的博客园
    慈善点击,点击此处

    2012年7月12日 8:51
  • 我用一个text来替代font后,发现同样是更新了,仔细想来,嘿嘿,这是javascript的特性,动态改变客户端控件的状态,不需要刷新页面。思维被套住了。总是认为改变状态要刷新页面或者ajax,哎,惭愧...
    2012年7月13日 2:10

全部回复