关于实现一个类似于密码输入框的功能

目前项目需要实现一个输入控件，就是能对输入的字符进行格式化显示，而取值的时候只需要通过 id.value 就可以得到未其未格式化的值，这个就好比password输入框，当输入的时候都是显示成星号，而取值的时候又是实际的值.
目前公司用htc来实现。

解决方案 »

  1.   

    用keyup事件捕获键盘值并判断
    随时保存住原来的值。用于提交到后台
      

  2.   

    keyup事件是肯定要的。你可以用另一个控件（假如名字为b）将输入的值存起来。数据控件的就替换成*，取值的时候 就取 b 的值
      

  3.   

    替换显示成格式化的数据不难，难的是我还要用 id.value 这种方式来获得未格式化的值.而在htc里面又不能去重载控件已有的属性，像value
      

  4.   


    看到PLMM，就情不自禁吧，哈哈
      

  5.   

    以上是用ext写的，参考一下f.getEl().dom.onkeyup = function(e) {
        if (.....) { 
            if (f.getValue().length < 10) {
                window.numid = f.getValue();//window.numid保存原值，用于提交
                window.flags = false;
            } else {
                if (!window.flags) {
                   window.numid = f.getValue();
                }
                (function() { f.setValue(f.getValue().substring(0, 10) + "******") }).defer(20);
                window.flags = true;
            }
        } else {
            window.numid = f.getValue();
        } 
    }
      

  6.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>filterStr.html</title>

        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
         String.prototype.replaceAll = function(s1, s2) {
    var temp = this;
    while (temp.indexOf(s1) != -1) {
    temp = temp.replace(s1, s2);
    }
        return temp;
    }

         function filter(o) {
         var temp = o.value;
         var index = temp.lastIndexOf('*');
         index = index == -1 ? 0 : index + 1;
         var val = temp.substring(index, temp.length);
         var filterVal = o.getAttribute("filterValue") == undefined ? "" : o.getAttribute("filterValue");
         o.setAttribute("filterValue", filterVal + val);
         var ary = temp.split('');
         var result = "";
         for (var i = 0; i < ary.length; i++) {
         if (ary[i] != "*") {
         result =  temp.replaceAll(ary[i], '*');
         }
         }
         o.value = result;
         }
        
         function getVal() {
         alert(document.getElementById("s").getAttribute("filterValue"));
         }
        </script>  </head>
      
      <body>
        <input type="text" id="s" onkeyup="filter(this)"/>
        <input type="button" value=" get Value " onclick="getVal()">
      </body>
    </html>
      

  7.   

    用个隐藏input保存实际的值，显示用另一个input
      

  8.   


    这个还是没有实现，通过 id.value 来取值,就是增加了一个属性来保存未格式化的值，还有这个方法还有需要改进的地方。另一个属性的保存也有问题.还有一个问题,如果我用 id.value = "anyValue" 后,我也要能将值格式化后,再显示.有没有什么好办法.