Как выделить дважды нажатое слово во вводе после input.select () - PullRequest
Новая
       19

Как выделить дважды нажатое слово во вводе после input.select ()

0 голосов
/ 10 мая 2019

Есть вход с некоторым текстом. Весь текст в этом вводе должен быть выбран, когда ввод фокусируется (первый щелчок по вводу), и конкретное слово должно быть выбрано, когда происходит второй щелчок по вводу.

Я пытаюсь реализовать ту же функциональность, что и URL-панель в Chrome (версия 74.0.3729.131 (официальная сборка) (64-разрядная версия)).

Текущее поведение ввода вы можете увидеть здесь: https://jsfiddle.net/deaamod1s/rh5mw0e4/23/

Единственное решение, которое я вижу, это проверить - дважды щелкнул ввод или нет, и после этого, если дважды не щелкнул ввод - сделать input.select()

input.onfocus = function(e) {
        let hasValueWhenGotFocused = false;

        if (input.value) {
            hasValueWhenGotFocused = true;
        }
        setTimeout(() => {
            if (hasValueWhenGotFocused && this.className.indexOf("doubleclicked") == -1) {
                    this.select();
            } else {
                this.classList.remove("doubleclicked");
            }
        },400);
  }

    input.ondblclick = function(e){
        this.classList.add('doubleclicked');
    }

1 Ответ

0 голосов
/ 10 мая 2019

Обработчик события onfocus всегда выполняется до ondblclick . Я предлагаю отложить обработчик фокуса, чтобы он мог быть выполнен после возможного двойного щелчка (обновленная скрипта здесь ): 

input.ondblclick = function (e) {
    // set....
    this.dataset.dblclick = true;
}

input.onfocus = function (e) {
    this.dataset.dblclick = false;
    setTimeout(function (_this) {
        // if not set...
        if (_this.dataset.dblclick == "false") {
            _this.select();
        } else {
            // remove ...
            delete _this.dataset.dblclick;
        }
    }, 200, this);
}

Try to select second word using only two click<br>
<input type="text" id="input" value="sdsas select_me">
...