Question

这是我的代码：

<div tabindex="0" id="parent" style="margin-top:200px;margin-left:200px;background-color:black;height:100px;width:200px;">
    <input type="text" style="width:80px;margin:5px auto;display:none">
<div>



$("#parent").blur(function() {
     $(this).css("background-color", "blue").animate({
                marginLeft : '+=50'
            }, 400);
     $("#parent>input").css("display", "none");
   });

   $("#parent>input").focus(function() {
     $(this).css("display", "block");
   });
   $("#parent>input").blur(function() {
     $(this).css("display", "none");
   });
   $("#parent>input").keyup(function(e) {
    if (e.which === 13) {
        console.log("enter");
    }
   });

关注输入，导致在父div上触发模糊，导致div消失，因此用户无法在文本框中输入任何文本！

http://jsfiddle.net/z7Erv/10/

任何想法？

Answer 1

不确定这个问题是否已经过时 - 这可能是你想要做的吗？： https://jsfiddle.net/1280pn4n/1/

$('#parent').bind('focusin focusout', function () {
    $(this).toggleClass('showup');
});

我刚才遇到了同样的问题，Keltex的回答得到了帮助（使用focusin / focusout而不是onfocus / blur）：

jQuery figuring out if parent has lost 'focus'

专注于儿童元素，在父元素上开火模糊

1 个答案: