Textarea charCount - предотвращение пасты пользователя

Код ниже работает отлично, за исключением того, что если я вставляю строку с более чем 10 символами, она должна вставляться только в первые 10 символов. В настоящее время это не так, как мне помещать более 10 символов?

http://jsfiddle.net/qfzkw/2/

Ответ 1

Как указано, <textarea maxlength="10"> будет работать для небольшого количества случаев - но не всех.

Трудно определить, как запретить пользователю (например, firefox) входить в текстовую область, выбрав меню браузера Edit, а затем щелкнуть по Paste. Я действительно в недоумении, как это предотвратить. Вы можете проверить событие keydown, чтобы предотвратить ctrl + v. Вы можете отключить контекстное меню, чтобы запретить щелчок правой кнопкой мыши текстовой области (хотя злоумышленник может редактировать javascript переднего конца, а затем снова включить эту функцию).

Короче говоря, нет универсального способа предотвратить правильное вложение пользователя.

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

Внедрение глобального таймера. Реализуйте функцию, которая работает на 25 мс на основе этого таймера. Загрузите содержимое текстового поля. Посмотрите, изменились ли эти материалы.

текстовое поле

<textarea id="maintextarea"></textarea>

script

/*init*/
var globalTimer = new Date();
var cachedText = document.getElementById("maintextarea").value;
var iterationCount = 0;

function cacheText() {
    cachedText = document.getElementById("maintextarea").value;
}

function upDateTimer() {
    globalTimer = new Date();
    var timerTimeout = setTimeout('upDateTimer()', 5);
    timeBasedOperations();
}
upDateTimer();

function timeBasedOperations() {
    iterationCount++;//this will allow timing to occur
    //TODO: Add in other timers calls based on global timer
    if (iterationCount % 5) {//every fifth iteration (hence 25ms)
        checkTextArea();
    }
}

function checkTextArea() {
    var currentText = document.getElementById("maintextarea").value;
    var textArea = document.getElementById("maintextarea");
    if (currentText.length > cachedText.length) {
        //TODO: Add additional logic for catching a paste or text change
        textArea.value = currentText.substr(0, 10);
    }
    cacheText();
}

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

:)

Ответ 2

просто используйте <textarea maxlength="10"></textarea>​

Для этого не требуется javascript. Он также автоматически позаботится о копировании.

Вот обновленный jsFiddle.

Ответ 3

Вы не можете заглядывать в буфер буфера из браузеров, поэтому ваш единственный вариант - ограничить его до 10 символов, как вы сейчас делаете. Используйте атрибут maxlength = "10" вместо знака, который вы делаете в JavaScript.

<textarea maxlength="10"></textarea>​