Событие ввода текста HTML - PullRequest
Новая
       10

Событие ввода текста HTML

1 голос
/ 09 ноября 2009

У меня есть форма, и я хочу отключить / включить ее кнопку отправки в зависимости от того, являются ли поля ввода текста формы пустыми или в них был введен текст.

Я думаю, что это означает наличие обработчика событий для полей ввода * '1003 * или keypress событий: при запуске этот обработчик событий должен проверять, содержат ли поля ввода текста текст, и включать или отключать кнопку отправки соответственно.

Событие change выглядит так, как будто оно должно быть более полезным, чем события keydown или keypress, за исключением того, что оно не запускается до тех пор, пока рассматриваемый элемент управления не потеряет фокус, и что в этом хорошего: пользователь хочет просто набрать что-то, а затем нажать кнопку отправки, я хочу обработчик событий, который запускается при вводе текста, а не только когда элемент управления теряет фокус.

Мои вопросы:

  • События keydown и / или keypress срабатывают до или после вставки соответствующего текста в поле ввода текста?
  • Можно ли отменить события keydown и / или keypress (можно ли отменить их, чтобы запретить ввод соответствующего текста)?

Редактировать: К вашему сведению, подключаемый модуль jQuery для проверки повторно проверяет правильность формы при вводе ключа.

1 Ответ

1 голос
/ 09 ноября 2009

В ответ на ваши вопросы ...

  1. События нажатия клавиш или нажатия клавиш могут быть перехваченным до ввода текста используя JavaScript
  2. Вы можете вернуть false после привязки функция на клавишу или нажатие клавиши событие. Это предотвратит текст из ввода.

Пример использования jQuery: 

$("#inputfield").live("keydown", function(){
    return false;
});

Если вы хотите проверить некоторые входные данные для отправки в форму, вы можете сделать это с помощью jQuery submit () . 

$("#theform").submit(function() {
    var formval = $("#theinput").val();
    if(formval == "") { //or some better test
        alert("input value"); //or some other alert...
        return false;
    } else {
        return true;
    }
});

Возврат false приведет к аннулированию клика для отправки формы.

Edit: Если, как вы говорите в своих комментариях, вы хотите отключить отправку формы, пока не будут выполнены требования для полей ввода 

$("#inputfield").live("keyup", function(){
    if($("#inputfield").val() == "") {
        $('#button').attr("disabled", true); 
    } else {
        $('#button').attr("disabled", false); 
    }
});

Вы хотите использовать обработчик событий " keyup ", чтобы разрешить отправку текста в первую очередь. посмотрите мой пример: на jsbin

...