.focus() 在悬停事件中无法处理 textarea答案

【问题标题】：.focus() not working on textarea in hover event.focus() 在悬停事件中无法处理 textarea
【发布时间】：2016-01-23 22:19:04
【问题描述】：

所以我这里有这段代码。

timeline.afterMilestonePrototypeCreated = function() {
    $(MILESTONE_PROTOTYPE_SELECTOR).hover(function(e){
       $(this).find('textarea').focus();
    });
}

它应该在创建后聚焦 textarea 元素。一切正常，我什至在创建和悬停后检查了事件是否被调用。其他所有代码都有效，但我无法关注该 textarea 元素。经过一番谷歌搜索后，我尝试添加一个 setTimeout，但也没有用。

谢谢！

已解决：

textarea 的父元素是一个点，在将点悬停后它变成一个更大的圆圈，并且比它的内部元素变得可见。问题是，当添加超时时，我设置的持续时间很短，因此用于使 textarea 可见的 css 过渡仍在进行，这就是它没有聚焦的方式。

【问题讨论】：

你能展示你的 HTML 吗？ console.log($(this).find('textarea').length) 显示什么？
它说“1”。动态添加的部分的 html 如下所示。
在这里工作：jsfiddle.net/barmar/mjof31vn/1

标签： javascript jquery hover focus textarea

【解决方案1】：

而不是这个：

$(this).find('textarea').focus();

试试这个：

$(e.target).find('textarea').focus();

【讨论】：

在 jQuery 事件处理程序中 this 不总是与 e.target 相同吗？
@Barmar $(this) 和 event.target 之间存在差异。虽然 this（或 event.currentTarget，见下文）始终指代侦听器附加到的 DOM 元素，但 event.target 是被单击的实际 DOM 元素。 stackoverflow.com/a/21667010/1179430
@ArcaneCraeda 在那种情况下，$(this) 不是更正确吗？当您将鼠标悬停在包含其他元素的 DIV 上时，e.target 将是其他元素，直到事件冒泡到 DIV。

【解决方案2】：

只要$(this).find('textarea') 按预期工作，这可能会起作用：

timeline.afterMilestonePrototypeCreated = function() {
    $(MILESTONE_PROTOTYPE_SELECTOR).hover(function(e){
       e.preventDefault();
       $(this).find('textarea').focus();
    });
}

悬停事件触发focus 事件，因此阻止它将允许手动focus 发生。

【讨论】：

那也没用。一旦父元素不再悬停，也许它与隐藏文本区域可见性的css有关？
为什么悬停事件会触发焦点事件？它将焦点放在哪里？
@Barmar 许多事件触发焦点，包括点击和悬停，但我不知道为什么......
解决了这个问题。 textarea 的父元素是一个点，在将点悬停后，点变成了一个更大的圆圈，并且比它的内部元素变得可见。问题是，当添加超时时，我设置的持续时间很短，因此用于使 textarea 可见的 css 转换仍在进行，这就是它没有聚焦的方式。
@tyler_house 很高兴听到你想通了！