Textarea отстает после регистрации событий `keydown` с использованием Javascript - PullRequest
Новая
       29

Textarea отстает после регистрации событий `keydown` с использованием Javascript

5 голосов
/ 17 января 2009

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

РЕДАКТИРОВАТЬ : Я должен добавить (не могу поверить, что я забыл!), Что это не влияет на браузеры настольных компьютеров. Это в основном проблема с iPhone Safari. Также могут быть затронуты другие мобильные браузеры, но мы ориентируемся на iPhone Safari, поскольку он лучше всего выполняет JS (AFAIK)

Ответы [ 4 ]

2 голосов
/ 17 января 2009

Учитывая ваше редактирование относительно того, что это сфокусировано на доступе к iPhone ...

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

Альтернативой ответу Дейва является ожидание приостановки пользователя (например, в течение 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);
};

Это должно установить таймер с первым нажатием клавиши, останавливая и воссоздавая таймер для каждого последующего нажатия. Наконец, через 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);
1 голос
/ 17 января 2009

Возможно, вы могли бы опубликовать «кучу кода», и мы могли бы обсудить, есть ли там какой-то рефакторинг (перед тем, как сложить его с таймером). Похоже, что вы можете сначала перейти к вторичной оптимизации.

0 голосов
/ 17 января 2009

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

0 голосов
/ 17 января 2009

Ну, одним из способов было бы не использовать 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
}
...