JavaScript(或jQuery)中是否有"焦点"？

Question

有什么我可以这样做(通过插件perhap)

if ( ! $('form#contact input]').hasFocus()) {
  $('form#contact input:first]').focus();
}

基本上,将焦点设置为第一个输入,但仅当用户尚未点击任何内容时？

我知道这也会奏效,但有什么更优雅的吗？

$(function() {
  var focused = false;
  $('form#contact input]').focus(function() {
    focused = true;
  }); 
  setTimeout(function() {
    if ( ! focused) {      
      $('form#contact input:first]').focus();
    }
  }, 500);
});

Answer 1

没有本机解决方案,但是有一种更优雅的方式可以做到:

jQuery.extend(jQuery.expr[':'], {
  focus: "a == document.activeElement"
});

你正在定义一个新的选择器.请参阅插件/编写.然后你可以这样做:

if ($("...").is(":focus")) {
  ...
}

要么:

$("input:focus").doStuff();

Answer 2

$('input:focus')

这是CSS.您无需创建"自定义选择器".它已经存在!http://www.w3schools.com/CSS/pr_pseudo_focus.asp

只需将您想要执行的任何进程附加到该选择器,如果相关元素没有聚焦,它就会将其清除掉.我最近这样做是为了防止在keyup没有使用电子邮件输入时实例化电子邮件输入错误检查.

如果您要做的就是检查用户是否专注于任何事情,请执行以下操作:

if($('input:focus').size() == 0){
    /* Perform your function! */
}

Answer 3

jQuery 1.6现在有一个专用的:focus选择器.

Answer 4

使用jQuery 1.3.2和Firefox 3.6.8时,我遇到了使用cletus方法的问题,因为字符串"a == document.activeElement"不是有效的函数.

我修复了它定义focus键的功能.实际上,定义的所有其他键jQuery.expr[':']都被定义为函数.这是代码:

jQuery.extend(jQuery.expr[':'], {
    focus: function(e){ return e == document.activeElement; }
});

所以,现在它按预期工作.

但是,我在Firefox 3.6.8中遇到了一些奇怪的行为(可能是FF中的一个错误？).如果我在页面渲染时单击输入文本,并且如果我is(":focus")在页面加载时调用,我会从浏览器收到错误,由FireBug报告,并且脚本会中断.

为了解决这个问题,我用一个try...catch块包围了代码,返回false错误.如果您想阻止用户遇到相同的错误,请使用它:

jQuery.extend(jQuery.expr[':'], {
    focus: function(e){
        try{ return e == document.activeElement; }
        catch(err){ return false; }
    }
});

Answer 5

不,没有.

但是,您可以像这样模拟它:

$(':input')
    .data('focused', false)
    .focus(function() { $.data(this, 'focused', true); })
    .blur(function() { $.data(this, 'focused', false); });

Answer 6

考虑到解决方案实际上很简单,很难找到解决这个问题的方法:

if (document.activeElement == this) {
  // has focus
}

if (document.activeElement != this) {
  // does not have focus
}