Ограничение количества строк и количества символов на строку в текстовой области с помощью jQuery - PullRequest
Новая
       8

Ограничение количества строк и количества символов на строку в текстовой области с помощью jQuery

1 голос
/ 11 апреля 2011

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

Например, пользователь выбирает опцию A, текстовое поле должно быть ограничено 2 строками и 14 символами в строке. Вариант B, 3 строки, по 18 символов. И так далее, и тому подобное.

Я не могу взаимодействовать с веб-формой через hook_form_alter, чтобы добавить атрибуты к текстовой области для обратного вызова javascript. Я бы предположил, что это моя первая проблема. Однако я смог сделать это с помощью jQuery. 

$(document).ready(function() {

$('#mytext').keyup(function() {
    var v = $(this).val();
    var vl = v.replace(/(\r\n|\n|\r)/gm, "").length;
    if (vl == 0) {
        count = 1;
    }
    if (parseInt(vl / count) == chars) {
        $(this).val(v + '\n');
        count++;
    }

    if (count > 3) {
       var text = $('#mytext').val();
       var lines = text.split('\n');

       var test = implode('\n', lines);
        alert(test);
    }

});
});

Кроме того, как я могу считать строки и символы в строке и предотвращать ввод текста при соблюдении ограничений?

Я позаимствовал часть вышеперечисленного отсюда:

Количество символов в строке и количество строк в текстовой области

Ответы [ 2 ]

2 голосов
/ 12 апреля 2011

Это ограничит текстовое поле до 3 символов в строке.Измените chars, чтобы увеличить количество символов в строке.

var count = 1;
var chars = 3;
$('#mytext').keyup(function() {
    var v = $(this).val();
    var vl = v.replace(/(\r\n|\n|\r)/gm, "").length;
    if (vl == 0) {
        count = 1
    }
    if (parseInt(vl / count) == chars) {
        $(this).val(v + '\n');
        count++;
    }

});

Проверьте рабочий пример на http://jsfiddle.net/7jVrT/

0 голосов
/ 12 апреля 2011

Это не совсем правильный javascript, но я думаю, это даст вам хорошее начало. Вы должны по-настоящему возиться с логикой, чтобы убедиться, что логика строки 1 отделена от логики строки 2 и т. Д. Кроме того, вы можете использовать event.which, чтобы выяснить, какая клавиша была нажата. В качестве альтернативы событию нажатия клавиши вы можете попробовать использовать событие keydown, которое происходит до того, как символ будет набран в текстовой области: 

$(document).ready(function(){
    $('#myTextarea').keypress(function(event){
        var text = $('#myTextarea').val();
        var lines = text.split('\n');

        for (var lineIndex in lines) {
            if (lines[lineIndex].length > 10) {
                event.preventDefault();
                return;
            }
        }

        if (lines.length > 2) {
            event.preventDefault();
            return;
        }
    });
});
...