javascript - 如何检测文本区域何时失去焦点并在单击特定元素时防止其失去焦点？

Question

我有一个文本区域#ta，下面有一个列表#ac-list，用于自动完成:

<div id='container'>
    <textarea id="ta" name="god" rows="20"></textarea>
    <ul id='ac-list' style='visibility:hidden'></ul>
</div>

当文本区域失去焦点时，我想隐藏#ac-list。所以我在文本区域调用jquery的blur:

$('#textarea').blur(function () {
    $('#ac-list').css('visibility', 'hidden');
})

这可行，但我想添加一个约束，即当用户单击#ac-list 时文本区域不应失去焦点。我该怎么办？

Answer 1

这是您需要的吗？这只是一个解决方法。文本区域模糊和 li 项目聚焦所需的时间因计算机而异。

HTML:

<div id='container'>
    <textarea id="ta" name="god" rows="20"></textarea>
    <ul id='ac-list'>
        <li>dsfd</li>
    </ul>
</div>

JavaScript:

var textAreaBlur = null;

$('textarea').blur(function () {
    textAreaBlur = new Date();
});

var clickTimes = 0;
$("#ac-list > li").click(
    function() {
        if((new Date() - textAreaBlur) < 200) {
            $("#ta").focus();
            $(this).text("dsfd" + ++clickTimes);
        }
    }
);