ограничить количество символов, которые можно вставить в текстовое поле - PullRequest
11 голосов
/ 03 февраля 2010

Можно ли определить, сколько символов вставляется в текстовую область HTML, и отменить вставку, если превышен лимит?

Редактировать: я пытаюсь не допустить, чтобы пользователь вставлял огромное количество символов (~ 3 миллиона), потому что это приводит к сбою в некоторых браузерах. Поэтому я хочу отменить вставку до того, как их браузер заблокируется. Я делаю редактор документов, где пользователи могут попробовать это. Но они могут печатать столько, сколько хотят.

Ответы [ 5 ]

11 голосов
/ 03 февраля 2010

вы можете сделать это на jQuery следующим образом:

$(document).ready(function(){
function limits(obj, limit){

    var text = $(obj).val(); 
    var length = text.length;
    if(length > limit){
       $(obj).val(text.substr(0,limit));
     } else { // alert the user of the remaining char. I do alert here, but you can do any other thing you like
      alert(limit -length+ " characters remaining!");
     }
 }


$('textarea').keyup(function(){

    limits($(this), 20);
})

  })

посмотреть демо здесь .

6 голосов
/ 12 февраля 2010
$("textarea").blur(function(event) {
    var maxLength = 3000000;
    var length = this.value.length;
    if (length > maxLength) {
        //reassign substring of max length to text area value
        this.value = this.value.substring(0, maxLength);
        alert(maxLength + ' characters allowed, excess characters trimmed');
    }
});

Этот jquery присоединяет анонимную функцию к текстовым областям, это обрезает текст и предупреждает пользователя, вы также можете прикрепить его к событию нажатия клавиши.

Подробнее см. http://viralpatel.net/blogs/2008/12/set-maxlength-of-textarea-input-using-jquery-javascript.html.

2 голосов
/ 04 сентября 2012

Вы не можете получить доступ к содержимому буфера обмена через JS, поэтому вы не можете предотвратить его.Тем не менее, у вас есть три варианта:

  1. Не разрешать пользователю вставлять содержимое (Это очень плохая идея для UX).
  2. Использовать событие onPaste для подстановкивставляемый контент от 0 до количества символов после его вставки.
  3. Используйте плагин javascript / flash (это не будет работать на мобильных устройствах).
  4. Используйте апплет или SilverLight (Мне это не нравится)

Это всего лишь несколько предложений, и если вы найдете другой способ сделать это, пожалуйста, дайте мне знать.

2 голосов
/ 03 февраля 2010

В IE вы можете использовать событие onPaste. ( документация MSDN )

В Firefox, Safari, Opera и Chrome вы можете использовать событие onInput ( Dottoro.com, ссылка ). Это событие возникает, когда текстовое содержимое элемента изменяется через пользовательский интерфейс, включая вставку.

0 голосов
/ 03 февраля 2010

Я бы использовал jQuery и добавил бы обработчик событий для текстовой области. Когда обработчик сработает, сделайте подсчет и ответьте по желанию.

...