js实现密码延迟变为星号

偶然发现有些网站在用户登陆时，在输入密码的过程中先看到输入的密码，延迟后再变成密文，很好奇，所以捣鼓了一下。

明文延迟转密文

以下为代码：（延迟后变成*号）

//js实现输入密码后，先显示当前输入的一位密码，然后再变成星号
<input class="ipt" type="text">

<script src="./js/jquery-2.2.4.min.js"></script>
<script>
  var str=""; //用于保存正确密码
  var val;
  $(".ipt").on("keyup",function() {
    this.value=this.value.replace(/s/,"");  //不允许输入空格，可设置为其他正则
    var val = this.value;
    if (val.length > str.length) {
      str+=val.substr(-1);  //取最后一位（未变成*前的数字）保存到str
    }
    this.value = val.replace(/./g, "*")
  })
</script>

切换显示和隐藏

补充下常用的密码显示/隐藏的方法，即点击按钮可切换密码的显示或隐藏（显示为圆点样式的密码）。
以下为代码：

<input class="ipt" type="text">
<button>按钮</button>
<div class="square"></div>

<script src="./js/jquery-2.2.4.min.js"></script>
<script>
  var flag=1;
  $("button").on("click",function() {
  if(flag) {
    $(".ipt").attr("type","password");
    $(".square").css("background-color","gray");  //这里可切换为修改img的src（显示或隐藏密码的小眼睛）
    flag=0;
  }else{
    $(".ipt").attr("type","text");
    $(".square").css("background-color","green");
    flag=1;
  }
})

问题

使用keyup来监听事件，并不能阻止用户复制粘贴密码到输入框，这时就不能及时替换为*号，期待更完美的方法。
后续补充……