Question

我有以下代码：

$('#myEl').blur(function(){
  $(this).remove('.children');
});

但是，children元素内部有链接，另一个jQuery动作不会触发，因为.children在模糊时被删除，我想这是在点击动作之前触发的。简单的例子：

儿童是可见的，＃myEl有焦点
我点击了儿童链接
#myEl失去了他的专注
删除子元素
未触发儿童链接操作，因为我认为链接不再存在

如何解决这个问题？我试图推迟删除：

$(this).delay(100).remove('.children');

没有运气。

Answer 1

如果您正在使用延迟方式，则不能使用jQuery .delay()，因为它只适用于排队元素（带动画）。

您可以使用setTimeout：

$('#myEl').blur(function(){
  var $this = $(this);
  setTimeout(function(){
    $this.remove('.children');
  }, 100)
});

Answer 2

我已经尝试过mousedown事件并且工作正常。我没有添加延迟总是一个不错的选择。

   <input type="text" id="myEl"></input>
    <div class="children" >div child</div>
    <script>
        $('#myEl').blur(function(e){
            $('.children').remove();

        });

        $(".children").mousedown(function() {
            window.open('http://www.google.com')
        });
    </script>

如果您确实想要出于特定原因添加点击事件，那么您可以尝试： -

       $('#myEl').blur(function(e){
            if(mousedown){
               window.open('http://www.google.com'); 
               mousedown = false;
            }
            $('.children').remove();

        });
        $('.children').click(function(e){
            window.open('http://www.google.com')
        });
        $(".children").mousedown(function() {
           mousedown = true
        });

Answer 3

如何简单地在点击后隐藏子元素？或者甚至让孩子自己在处理完点击后从父容器中删除所有孩子？

$('#myEl').blur(function(){ $(this).children('.children').hide(); }); $('.children').on("click",function(){ // perform your click-code actions here alert("I did it!"); // now remove your child elements from the parent $(this).parent().children('.children').remove(); });

jQuery - 删除模糊元素但是点击他的孩子

3 个答案: