Textarea使用Javascript限制字符和线条

Question

这个主题有一些相似的主题，但是当前的要求更加具体，我无法将它与现有的解决方案结合起来，所以请求社区帮助我。我需要建立textarea的JS验证为规则：

• 4行的最大

• 的128个字符最大

• 剩余字符计数器textarea的下显示32个字符

• 等我已经找到了怎么办...

请问我可以如何执行此操作？

p.s.应该明确的JavaScript解决方案

Answer 1

这是你的代码应该怎么样子（也JSFiddle见）：

var rows = 4; 
var cols = 32; 

var body = document.body; 
var ta = createElem(body, 'textarea'); 
var div = createElem(body, 'div'); 

ta.rows = rows; 
ta.cols = cols; 

ta.addEventListener('keyup',() => { 
    var lines = ta.value.split('\n'); 

    lines = lines 
    .slice(0, Math.min(lines.length, rows)) 
    .map(line => line.substring(0, cols)); 

    ta.value = lines.join('\n'); 
    displayRemaining(cols * rows - ta.value.length + rows - 1); 
}); 

displayRemaining(cols * rows); 

function createElem(a, b){ 
    b = document.createElement(b); 
    a.appendChild(b); 
    return b; 
} 

function displayRemaining(a){ 
    div.innerHTML = 'Characters remaining: ' + a + '.'; 
}