检测元素何时将获得焦点答案

【问题标题】：Detecting when an element is about to get focus检测元素何时将获得焦点
【发布时间】：2013-03-21 20:05:30
【问题描述】：

我有一个带有 Telerik RadEditor（富文本框）的 ASP.NET 页面。在页面中切换时，当用户进入文本框时，焦点会在进入文本区域之前设置为各种工具栏图标。我在一个页面上添加了一些 jQuery，以便在跳出表单上的最后一个单元格时将焦点设置在文本区域上：

$('input[type=text][id*=tbCost]').keydown(function (e) {
    var keyCode = e.keyCode || e.which;
    if (keyCode == 9) {    //If TAB key was pressed
        e.preventDefault();
        var editor = $('body').find("<%=RadEditor1.ClientID%>");    //get a reference to RadEditor client object
        editor.setFocus();    //set the focus on the the editor
    }
});

我正在寻找一种在控件中实现此功能的方法，以便无论它位于哪个页面上，它都能正常工作。例如，在上面的代码中，仅当用户跳出tbCost 单元格时才设置焦点。当用户进入工具栏项目时，我希望能够将焦点设置到文本区域。

有什么方法可以检测元素何时即将获得焦点？我知道我可以查看一个元素是否有焦点，但我想不出实现此功能的方法。

谢谢

解决方案：

如果以后有人有同样的问题并想要一个例子，这里是我使用的代码：

 $(document).ready(function () {
    $('.reToolCell').focusin(function () {
        var editor = $('body').find("<%=RadEditor1.ClientID%>");
        editor.setFocus();
    });
});

【问题讨论】：

为什么不关注keyup()？
您可以使用 JQuery 的“bind”或“on”方法将此特定代码绑定到所有 input[type=text] 元素
@rnirnber 我认为使用on 可以工作。当工具栏（.reToolCell）获得焦点时，我可以做这样的事情来转移焦点吗？：$('.reToolCell').on('focus', function(){ var editor = $(this).find("<%=RadEditor1.ClientID%>");editor.setFocus(); });
好吧，"$find" 确实是 $(this).find...但是是的，除了它看起来不错，我一直都在做这样的事情。

标签： javascript jquery asp.net focus radeditor

【解决方案1】：

您可能会考虑绑定到工具栏图标上的焦点并将焦点重定向到文本区域。尽管如果用户试图通过 Tab 键聚焦这些工具以使用它们，这可能会产生意想不到的副作用。

【讨论】：

我同意如果用户尝试将焦点切换到工具栏，这可能会导致问题，但看起来这总体上可以正常工作。谢谢！

【解决方案2】：

    //on focus eventHandler for all your icons that calls a function


  #('.elementtype, class or a generic way of identifying the icons'.onfocus(myFunction(this))

//该函数获取元素的参数，移动到下一个兄弟元素并设置焦点

     myFunction = (element) {
       element.next().focus();
     }

【讨论】：