Question

这是回显的php字符串：

   $('.$name input').on( 'blur', function(e){
            $('span.$name div ul').on('click', 'li', function(ev){
                var value = $(this).attr('value');
                var html = $(this).html();
                console.log(value);
                $('span.$name select').val( value );
                $('span.$name input').val( html );
                $('span.$name div').hide();
            });
        });

所以我有一个处理程序，当它的输入失去焦点并点击列表项时，它会做一些事情并隐藏div。但是当输入失去焦点并且未点击列表元素时我也想隐藏。

如果我尝试这样做：

  $('.$name input').on( 'blur', function(e){
            $('span.$name div ul').on('click', 'li', function(ev){
                var value = $(this).attr('value');
                var html = $(this).html();
                console.log(value);
                $('span.$name select').val( value );
                $('span.$name input').val( html );

            });
     $('span.$name div').hide();
        });

它只是关闭div而''click''事件处理程序根本不起作用。没有错误，没有。

这也不起作用：

$('.$name input').on('blur',
  function (e) {
    $('span.$name div').hide();
});


$('span.$name div ul').on('click', 'li', function (ev) {
   var value = $(this).attr('value');
    var html = $(this).html();console.log(value);
    $('span.$name select').val(value);
        $('span.$name input').val(html);
});

我如何解决我的问题？谢谢

编辑：

DEMO：http://jsfiddle.net/e2dw18z0/

Answer 1

我想我可以看到你是如何解决这个问题的。当您离开输入并转到单击div时，输入的悬停事件会在div上注册单击之前关闭div。所以真正快速解决这个问题是：

    $('.test_name input').on( 'blur', function(e){
        window.setTimeout(function() {
            $('span.test_name div').hide();
        }, 100);
    });

如此处演示：

http://jsfiddle.net/sifriday/e2dw18z0/1/

超时确保div点击注册的时间，如果它即将到来。如果没有，没问题，并且按照需要关闭弹出窗口。正如上面的adeneo评论，这也整理了你的嵌套事件代码。

更简洁的方法是使用文档上的点击来关闭弹出窗口，但仅当弹出窗口可见并且输入没有得到焦点时才会显示：

    $(document).on( 'click', function(e){
        if (
            $('span.test_name div').is(":visible") && 
            !($('span.test_name input').is(':focus'))
        ) $('span.test_name div').hide()
    });

如此处演示：

http://jsfiddle.net/sifriday/e2dw18z0/3/

一个事件处理程序覆盖第二个事件处理程序

1 个答案: