предотвращение эффекта функции javascript keyup, когда пользователь находится в текстовом поле?

Question

предотвращение эффекта функции javascript keyup, когда пользователь находится в текстовом поле?

0

В настоящее время я использую следующий код, чтобы позволить пользователю "перелистывать" содержимое в моем веб-приложении:

$(this).keyup(function(e) {
    if(e.which == 37) {
        document.location = $("#prev_button").attr('href');
    }else if(e.which == 39) {
      document.location = $("#next_button").attr('href');
    }
});

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

идентификатор формы - это "searchForm". Могу ли я добавить предложение к выражению if, которое вычисляет false, если выбрана форма поиска?

mgoldwasser 25 апр. 2014, в 20:38

Источник

0

Да, мы можем проверить это focus элемента. Например, в jQuery: if( $("#myEle").is(":focus") ) return false; ,
Spencer Wieczorek 25 апр. 2014, в 17:49

Теги:

javascript

jquery

keyup

onkeyup

3 ответа

3

Вы можете остановить распространение события в текстовом поле, чтобы событие не попало в ваш другой обработчик:

$('#searchbox').keyup(function(e) {
    e.stopPropagation();
});

Jason P 25 апр. 2014, в 15:44

1

Посмотрите эту тему :) Найдите, если в настоящий момент выбран текстовый блок

function checkFocus() {

  if ($(document.activeElement).attr("type") == "text" || $(document.activeElement).attr("type") == "textarea") {

  //Something selected

  return true;

 }

}

user3426703 25 апр. 2014, в 15:15

Ещё вопросы

Да, мы можем проверить это focus элемента. Например, в jQuery: if( $("#myEle").is(":focus") ) return false; ,

Oriol · Accepted Answer · 2014-04-25T16-48-00.000Z

Я бы использовал что-то вроде: Demo

$(this).keyup(function(e) {
    if(~['input', 'textarea'].indexOf(e.target.tagName.toLowerCase())) return;
    if(e.which == 37) {
        document.location = $("#prev_button").attr('href');
    }else if(e.which == 39) {
        document.location = $("#next_button").attr('href');
    }
});

Таким образом вы можете исключить все элементы <input> и <textarea>.

IMO, исключая только #searchbox, не является отличным решением, поскольку в будущем вы можете изменить свой id или включить другие текстовые поля, но забудьте, что вы должны отражать изменения в скрипте исключения.

Это решение состоит из 1 строки кода и предотвращает возникновение проблем во всех будущих формах, которые мне, возможно, потребуется добавить. Я бы посоветовал всем, кто читает этот вопрос, использовать это решение, так как оно общее, краткое и правильное.