Question

我知道这不应该那么难，但我找不到谷歌的答案。

我想执行一段javascript，它可以从任何元素中清除焦点，而无需提前知道焦点所依赖的元素。它必须适用于firefox 2以及更现代的浏览器。

有没有好办法呢？

Answer 1

答案：document.activeElement

--- ----编辑

技术上：document.activeElement.blur()

----编辑2 ----

function onElementFocused(e)
{
    if (e && e.target)
        document.activeElement = e.target == document ? null : e.target;
} 

if (document.addEventListener) 
    document.addEventListener("focus", onElementFocused, true);

Answer 2

.focus()然后.blur()页面上任意其他内容。由于只有一个元素可以具有焦点，因此将其转移到该元素然后将其移除。

Answer 3

document.activeElement.blur();

在IE9上工作错误 - 如果活动元素是文档正文，它会模糊整个浏览器窗口。最好检查这种情况：

if (document.activeElement != document.body) document.activeElement.blur();

Answer 4

dummyElem.focus（）其中dummyElem是一个隐藏对象（例如，有负zIndex）？

Answer 5

您可以调用window.focus（）;

但移动或失去焦点必然会干扰使用Tab键绕过页面的任何人。

您可以听取键码13，如果按下Tab键，则放弃效果。

Answer 6

使用TypeScript时，此处提供的答案都不完全正确，因为您可能不知道所选元素的种类。

因此，这将是首选：

<form method="post" action="/teacher/create/exam/">
  {% csrf_token %}
  <div class="form-group col-md-8">
    <label for="topic">Topic</label>
    <input type="text" name="topic" class="form-control" id="topic"/>
  </div>
  <div class="form-group col-md-8">
    <label for="grade">Author</label>
    <input type="text" name="author" class="form-control" id="author"/>
  </div>
  <div class="form-group col-md-8">
    <label for="date">Date</label>
    <input type="date" name="date_now" class="form-control" id="date"/>
  </div>
  <div class="form-group col-md-8">
    <label for="grade">Course</label>
    <input type="text" name="course" class="form-control" id="grade"/>
  </div>
  <div class="form-group col-md-8">
    <label for="grade">grade</label>
    <input type="number" name="total_grade" class="form-control" id="grade"/>
  </div>
  <div class="form-group col-md-8">
    <label for="cat">Semester </label>
    <select name="semester"  class="form-control">
      <option value="1"> Semester 1</option>
      <option value="2"> Semester 2</option>
    </select>
  </div>
  <button type="submit"
    class="btn btn-primary m-t-15 waves-effect">Save
  </button>
</form>

我进一步不鼓励使用公认的答案中提供的解决方案，因为由此产生的模糊不属于官方规格的一部分，并且随时可能破裂。

Answer 7

如果元素中有一个带有“活动”类的顶部菜单，则可以使用它：

$(".menu-header:first").find(".active").focus();

它适用于如下菜单样式：

<div class="menu-header" data-bind="invisible:isVisible">
                <ul class="nav navbar-nav navbar-header">
                    <li><a class="nv" href="/Home" id="home-menu"><span><i class="fa fa-home"></i></span>Hjem</a></li>
                    <li><a class="nv active" href="/nb-no/CV" id="cv-menu"><span><i class="fa fa-pencil-square-o"></i></span>CV</a></li>
                    <li><a class="nv" href="/myjobapps" id="app-menu"><span><i class="fa fa-files-o"></i></span>Søknader</a></li>
                    <li><a class="nv" href="/alladverts" id="jobs-menu"><span><i class="fa fa-search"></i></span>Jobber</a></li>
                    <li><a class="nv" href="/Options" id="option-menu"><span><i class="fa fa-ellipsis-h"></i></span>Mer</a></li>
                </ul>
            </div>

Answer 8

使用jQuery，其公正性：$(this).blur();

你如何清除javascript中的焦点？

8 个答案: