1. 程式人生 > >前端輸入密碼顯示**,點選某個控制元件顯示數字

前端輸入密碼顯示**,點選某個控制元件顯示數字

首先這個是回答別人問題的答案。但由於第一次貼上的答案是有bug的,所以想進行第二次回覆,結果被禁言了,一臉懵逼,好吧,禁就禁吧,我將答案寫成部落格不會被禁了吧?首先說明一下,這是基於jquery的

最簡單的是現有的可以用一下辦法

        顯示密碼
        $('#passWord').attr('type','text');
        隱藏密碼
        $('#passWord').attr('type','password');

  --------------------------------------------------------------------------------------完美分割線--------------------------------------------------------------------------------------------------------------------

<input class="passWord" type="tel" name="" id="passWord" value="" /><span id="getNumber"> 點我隱藏</span>

        如果你需求是****的話,程式碼如下
            var hide = false;
            var numbers = null;
            var shanStr = "";
            $("#passWord").bind('input porpertychange', function() {
                var value = $(this).val();
                var str = "";
                $(this).val().length == 1 ? numbers = $(this).val().toString() : numbers = numbers + ($(this).val().toString()).substring(value.length - 1, value.length);
                for(var i = 0; i < value.length; i++) {
                    str = str + "*"
                }
                shanStr = str;
                if(hide == false) {
                    $(this).val(str)
                }
            })
            $("#getNumber").unbind("click").bind("click", function() {
                $("#passWord").val("")
                if(hide == true) {
                    $("#passWord").val(shanStr);
                    hide = false;
                } else {
                    $("#passWord").val(numbers);
                    hide = true;
                }

            })

粗糙的程式碼,各位大神優化後可以分享一下給我呢