延遲密碼輸入掩碼，javascript中的android樣式/ jquery

Question

讓我先說我的任務已完成。但我試圖理解它是如何工作的，有一件事讓我感到困惑。換句話說，我偶然偶然發現了答案。

我的任務很簡單：在輸入框中，通過在延遲後將每個字符更改爲*來屏蔽用戶鍵入的輸入。這是Android手機處理屏蔽輸入的方式，與iPhone略有不同。

我使用了jQuery/javascript和正則表達式的組合。我的工作代碼：

$('.room_input').focus(function() { 
    currentFocus = $(this); 
}); 

$('.key').click(function() { 
    setTimeout(function() { 
     currentFocus.val(currentFocus.val().replace(/[^\*]/, '*')); 
    }, 2000); 
}); 

這很簡單，而且效果很好。當每個鍵被按下時，它在2秒後變爲*。 每把鑰匙都在自己的計時器上。但有一件事我不明白。當setTimeout的回調觸發時，上面的代碼似乎會將文本框的內容設置爲*。因爲上面的「替換」用任何不是*的字符替換了整個值的內容。

但它沒有。每個鍵在被點擊2秒後都會改變（因爲它應該）。 這是爲什麼？我認爲這可能是正則表達式 - 它只會改變它找到的第一個匹配項嗎？我只是回答我自己的問題嗎？

更新：我做到了。 這是正則表達式。它只取代第一個字符串中的匹配字符。我認爲這可能與單線程問題有關......像往常一樣，我的問題比現在要困難得多。 :)

Answer 1

是的，你是對的。

每次按鍵單擊都會添加一個字符，然後啓動一個計時器，稍後將第一個非星號轉換爲星號。這比你想象的要簡單得多。