javascript - 处理点击事件

Question

我正在创建一个切换，当我单击按钮时聚焦输入，并在我单击输入外部或第二次单击按钮时模糊它。

我唯一的问题是当我在输入之外单击时，我需要在按钮上单击两次以再次聚焦输入。

我的功能

let isFocused = false
const blurAlias = () => {
  document.getElementById('aliasInput').blur()
  document.getElementById('aliasInput').setAttribute("disabled", true);
}
const focusAlias = () => {
  isFocused = !isFocused

   if ( document.activeElement === document.getElementById('aliasButton')) {
      document.getElementById('aliasInput').removeAttribute("disabled")
      document.getElementById('aliasInput').focus();
      document.getElementById('aliasInput')
      .addEventListener("keyup", function(event) {
        if (event.keyCode === 13) {
        event.preventDefault();
        blurAlias()
        }
    });
    }
  }

我的 HTML：

<input disabled class="break-word mb-0 editAliasInput" 
       data-ng-value="ext.helpers.handleAlias($ctrl.state.accounts.accountDetails)" 
       id="aliasInput" maxlength="35" 
       onkeypress="this.style.minWidth = ((this.value.length + 1) * 12) + 'px'"
       onblur="setAttribute('disabled', true)">
<button class="editAliasButton" ng-click="ext.helpers.focusAlias()" 
        id="aliasButton"><i class="fas fa-edit"></i>
</button>

标签： javascriptangularjs