Javascript $（element）.focus（）在回调中未按预期工作

我正在编写一个HTML表单，供非正式借阅库使用。我制作了单选按钮来确定一个人是离开还是带走一本书。单击按钮时，我希望显示一个表单，隐藏另一个表单。我的功能基本上正常工作，但当选中单选按钮时，我无法将焦点放在表单中的第一个文本输入上。下面是我的例子：

 $("#addRadio").click(function(){
    $("#takeForm").slideUp();
    $("#addForm").slideDown(400, function(){
        $("#addSearchField").focus(); 
        console.log("This fired")});
    })

单击

#addRadio

时，向上/向下滑动会正常进行，

控制台.log

会启动，但

#addSearchField

不会获得焦点。如果用户开始键入，则会在

addRadio

按钮周围出现一个小焦点框，这是他们单击的最后一个元素

---

我遗漏了什么？

找到了。对于我试图关注的表单字段，我有一个“name”属性，但没有一个“id”属性。我很惊讶控制台中没有显示任何与此相关的内容。

请创建一个代码笔来演示您的代码示例下面是一个JSFIDLE：