jQuery — установить максимальную длину для текстовой области

#javascript #jquery #jquery-plugins

#javascript #jquery #jquery-плагины

Вопрос:

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

Требования следующие:

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

Есть ли плагин jQuery для этого? Или есть простой способ javascript сделать это (метод onChange не обновляется по мере ввода, и у keydown / keyup возникнут проблемы с изменениями мыши)

На данный момент кажется, что лучший способ — это иметь функцию, которая будет делать то, что я хочу (проверять длину и обновлять сообщение), вызывать ее с помощью keydown / keyup / change, а также опрашивать ее несколько раз в секунду. Есть ли способ лучше?

Ответ №1:

Обычно вы подключаете несколько обработчиков событий, указывающих на функцию проверки, но вы не сможете остановить щелчок правой кнопкой мыши / вставку этим…

 $(document).ready(function() {
    $("#myTextArea").live("change keydown keyup keypress", function() {
        validate();
    });
});

function validate() {
    // validates #myTextArea
}
  

Комментарии:

1. И input событие, и propertychange

2. я полагаю, вам не нужно, $(document).ready(function() { если вы используете live

Ответ №2:

попробуйте это

 $("#textarea").on('input',function(){
    if(this.value.length > 50) {
        alert("u cant input more.");
        this.value = this.value.substring(0,50);
    }
    $('#counter').html(this.value.length   '/50');
});
  

может быть, этот код поможет вам