JSFiddle - React, Tailwind, and code Playground

by Сергей Тарасевич

HTML

<input type="password" onmousedown="fnClass.mousedownFn( this )" onmouseup="fnClass.mouseupFn( this )" value="name">
<input type="password" onmousedown="fnClass.mousedownFn( this )" onmouseup="fnClass.mouseupFn( this )" value="phone">

JavaScript

let fnClass = {
  fn: undefined,
  funTime: function(event, type) {
    if (type == 'up') {
      fnClass.fn = setTimeout(function() {
        event.type = 'password';
      }, 10000);
    } else {
      event.type = 'text';
      clearTimeout(fnClass.fn);

    }
  },
  mousedownFn: function(event) {
    fnClass.funTime(event, 'down');
  },
  mouseupFn: function(event) {
    fnClass.funTime(event, 'up');

  },
};