如何在单击时再次将焦点状态应用于同一元素

How to apply focused state to same element again when clicked?

本文关键字：状态 焦点 应用于 元素 单击      更新时间：2023-09-26

对于我的表单输入，我想重新做我的焦点状态的动画输入:

<input type="text" class="form-control">

你可以在这里看到它的作用:https://jsfiddle.net/esg1dzy0/

说了这么多，我不能让它这样做:

  $(document.activeElement).click(function(){
    this.focus();
  });

这可能吗?我做错了什么?

你需要先模糊元素。

在你这样做之前，你需要确保这不是第一次点击元素。

同样，您的原始选择器将只选择在您的代码段运行时处于活动状态的元素。

最后，使用鼠标向下键来避免闪烁。

$('.form-control').mousedown(function(){
    if(!$(this).is(':focus')) return;
    $(this).blur().focus();
});

希望这对你有帮助:

$('.form-control').on('click', function(){
  var $this = $(this);
  var duration = 300;
  var enableAgain = function(){
    $this.blur().focus();
  };
  setTimeout(enableAgain, duration);
});

在300 milliseconds之后再次触发blur()和focus()事件(在最好的情况下)，这与transition-duration相同，您可能需要更大的值，如350。

顺便说一句，我已经编辑了你的https://jsfiddle.net/esg1dzy0/文件。

相关文章：