jQuery：如何在将鼠标悬停在其他元素上时删除并重新设置焦点

Question

我使用Bootstrap 3并且有一个标准输入字段，如下所示我在页面加载时通过jQuery设置焦点：

我的输入： <input type="text" class="form-control" id="searchTerm" />

我的jQuery： $('#searchTerm').focus();

在同一页面上，我有一个Bootstrap导航栏，想要在导航栏上导航时删除上面的焦点+在离开导航栏时重新设置焦点。 原因是否则闪烁的光标与我的导航栏下拉菜单重叠，因此它在下拉背景中可见。

我的导航栏

<nav class="navbar navbar-default" role="navigation">
    <div class="container">
        <div class="navbar-header margin-right-30">
          // ...

我想你可以使用课程"navbar"上的焦点/模糊事件来做到这一点，但我不确定是否以及如何实现这一点。

有人可以告诉我如何正确地做到这一点吗？

提前非常感谢，蒂姆。

Answer 1

您可能希望使用jQuery的.hover()和.focus()方法（链接中的文档）。请注意，.hover()方法接受一个回调参数，该参数是在事件发生时将被调用的函数。但是，.focus方法虽然可以采用回调方法，但可以不带参数调用，只需将焦点更改为点左边的元素即可。

例如，您可能希望执行以下操作：

$('#navBar').hover(function(){
  this.focus();
});