Задержки текстовой области после регистрации 'keydown' события с помощью JavaScript

Как каждый идет о присоединении набора кода к onkeydown событие, но продолжают вводить текст в a textarea быстро и хрустящий картофель? Что-либо больше чем несколько операторов IF, кажется, замедляет его вполне значительно.

Править: Я должен добавить (не может полагать, что я забыл!), что это не влияет на настольные браузеры. Это - главным образом проблема с iPhone Safari. Другие мобильные браузеры могли бы быть затронуты также, но мы фокусируемся на iPhone Safari, так как он выполняет JS лучшее (AFAIK)

5
задан fabrik 19 September 2018 в 07:31
поделиться

4 ответа

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

1
ответ дан 15 December 2019 в 06:36
поделиться

Рассмотрение редактирования относительно этого сфокусированного на доступе iPhone...

IPhone действительно просто не имеет так большого количества силы к нему. Вы будете более обеспечены просто использование onchange или onblur вместо onkeydown.



Альтернатива ответу Dave ожидает пользователя для приостановки (например, в течение 5 секунд):

var textarea = document.getElementById('textarea');

function checkTextArea() {
   if (textarea.value /* ... */) {
     /* ... */
   }
}

textarea.keyDownTimeout = null;
textarea.onkeydown = function () {
  if (textarea.keyDownTimeout) clearTimeout(textarea.keyDownTimeout);
  textarea.keyDownTimeout = setTimeout(checkTextArea, 5000);
};

Это должно установить таймер с первым keydown, остановившись и воссоздав таймер для каждого последовательного keydown. Наконец звоня спустя 5 секунд после того, как пользователь прекращает вводить.

Кроме того, отметьте отсутствие круглой скобки после checkTextArea. Это даст setTimeout ссылка функции по сравнению с return.


Можно также настроить это в функции, чтобы помочь использовать для нескольких элементов:

function setPauseTimer(element, timeout, callback) {
  var timer = null;
  element.onkeydown = function () {
    if (timer) clearTimeout(timer);
    timer = setTimeout(function(){ callback(element); }, timeout);
  };
}

function checkTextArea(textarea) { /* moved from global to argument */
   if (textarea.value /* ... */) {
     /* ... */
   }
}

setPauseTimer(document.getElementById('textarea'), 5000, checkTextArea);
2
ответ дан 15 December 2019 в 06:36
поделиться

Ну, один способ пойти не использовал бы onkeydown, но использовал бы таймер вместо этого. Можно установить интервал, выполняющий функцию, проверяющую содержание TextArea, и выполнить логику туда. Кажется, что это было бы передачей большинство издержек. Так или иначе дайте ему выстрел, я думаю, что это могло бы помочь.

Вот то, как Вы использовали бы его:

// First param is the function to call, second is 
// time interval in miliseconds
var timer = setTimeout(checkTextArea(), 5000);

function checkTextArea() {
    var text = document.getElementById("textarea").value;
    // logic...
    timer = setTimeout(checkTextArea(), 5000); // we loop it back to 
                                               //the function with the timer
}
0
ответ дан 15 December 2019 в 06:36
поделиться

Я думал о методах таймера. Я верю setTnterval было бы лучше, чем a setTimeout, но это едва кажется оптимальным решением, не так ли?

0
ответ дан 15 December 2019 в 06:36
поделиться
Другие вопросы по тегам:

Похожие вопросы: