javascript - 需要 jquery 或 javascript 来限制 textarea 中的每行长度

Question

我有以下 html 文本区域:

<textarea name="splitRepComments"   cols="20" rows="3" ></textarea>

我已经使用 jQuery 在其上应用了最大长度限制。该功能如下:

var max = 100;
$('#splitRepComments').bind("keypress", function(e) {


    if (e.which < 0x20) {
        // e.which < 0x20, then it's not a printable character
        // e.which === 0 - Not a character
        return; // Do nothing
    }
    if (this.value.length == max) {
        e.preventDefault();
    } else if (this.value.length > max) {
        // Maximum exceeded
        this.value = this.value.substring(0, max);
    }
});

$('#splitRepComments').bind("paste", function(e) {


    setTimeout(function() {

        var e = jQuery.Event("keypress");
        e.which = 50; // # Some key code value
        $('#splitRepComments').trigger(e);
    }, 100);

});

我的障碍是我有要求，我们希望用户在每行(行)中仅输入 10 个字符。然后输入下一行。

这个函数也要服从textarea的maxlength限制。

此外，我已经尝试了 SO 的以下解决方案，但没有将输入输入到下一行。

https://stackoverflow.com/a/19876218/1487469

我有jsfiddle准备好供您引用。

Answer 1

try this:

    var max = 100;
    var characterPerLine = 10;

    $("textarea[name='splitRepComments']").bind("keypress", function(e) {

        if (e.which < 0x20) {
            // e.which < 0x20, then it's not a printable character
            // e.which === 0 - Not a character
            return; // Do nothing
        }
        //calculate length excluding newline character
        var length =  this.value.length - ((this.value.match(/\n/g)||[]).length);
        if (length == max) {
            e.preventDefault();
        } else if (length > max) {
            // Maximum exceeded
            this.value = this.value.substring(0, max);
        }
        if (length % characterPerLine == 0 && length!=0 && length < max)                           {
            $(this).val($(this).val()+'\n');
        }

    });