javascript - jQuery .focus() 回调不起作用

Question

我只是不明白，为什么这种 .focus 回调方式不起作用？

$('a.focus').click(function(){
    $('form input:first').focus(function(){
        console.log('done focus');         
    });
});  

现场演示：http: //jsfiddle.net/SHxbj/

我在这里做错了什么？

Answer 1

为什么不这样做：

$('a.focus').click(function() {
    $('form input:first').focus();
});
$('form input:first').focus(function() {
    console.log('focused');
});​

第一个块绑定点击链接以将光标聚焦在输入字段中，第二个块将焦点事件绑定在输入字段上并将消息发送到控制台。

jsFiddle 示例。

Answer 2

$('form input:first').focus(function(){
    console.log('done focus');         
});

该代码块将事件绑定到第一个表单输入，而不是在单击链接时执行焦点回调。您的代码按预期工作，而不是您可能想的那样。尝试单击链接，然后单击第一个输入。

你可能想要这个：

$('form input:first').focus();
console.log('done focus');

Answer 3

您的代码将回调绑定到focus事件，但实际上并不关注元素。您可以将其保留为回调并手动聚焦元素，或者您可以在聚焦后简单地触发它：

已编辑；感谢@GNi33 指出重复绑定！

var $input = $('form input:first');
$input.focus(function(){
    console.log('done focus');         
});

$('a.focus').click(function(){
    $input.focus();
});  

Answer 4

$('a.focus').click(function(){
    $('form input:first').focus(function(){
        console.log('done focus');         
    }).focus();
});  
​

小提琴