Как я могу определить, когда текстовая область теряет фокус, и не дать ей потерять фокус при щелчке по определенному элементу?

#javascript #jquery #html #javascript-events

#javascript #HTML #jquery #jquery-события

Вопрос:

У меня есть текстовая область #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 . Как я могу это сделать?

Комментарии:

1. Вы имеете в виду, что хотите, чтобы текстовая область не теряла курсор при управлении #ac-list ? Это невозможно. Я думаю, вам следует скрывать #ac-list , когда пользователи нажимают на нее или выходят из нее, а затем снова фокусируются в текстовой области.

Ответ №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);
        }
    }
);