Javascript 如何处理要切换的单击和焦点事件？

我有要求，当用户点击时，我需要显示或隐藏一个部分，在焦点上需要显示，然后在模糊上需要隐藏

我想把三件事联系起来

$(btn).on({click:toggle,focus:show,blur:hide});

var isOpen = false;
function toggle(){
if(!isOpen)show();
else hide();
}
function show(){
isOpen = true;
//my code to show
}

function hide(){
isOpen = false;
//my code to hide
} 

但点击并聚焦冲突事件

---

如何使其在两个事件的焦点和单击下工作？

您可以将两个“单击”、“焦点”、“模糊”事件绑定到按钮：

var btn = $("#btn");
btn.on('click', function() { 
    $("#testElement").toggle('slow');
});
btn.on('focus', function() {
    $("#testElement").show('slow');
});
btn.on('blur', function() {
    $("#testElement").hide('slow');
});

---

以下是“单击与焦点事件冲突”是什么意思？单击某个对象后，使用jQuery

bind（）

，也可以在该对象上设置焦点。@srelalpmohan描述的第一行说，从jQuery 1.7开始，.on（）方法是首选方法。如果用户不单击，如何设置焦点？使用tab键？如果部分已经隐藏，它将如何获得焦点，如果它没有隐藏，为什么需要显示它？