How to insert a newline character after every 200 characters with jQuery
I have a textbox that I use to insert some information. I want to insert a newline character after every 200 characters开发者_开发百科 using jQuery or JavaScript.
For instance:
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
In this example, I want to insert a newline chracter after every 200 characters. How can I do this?
Break the string after every 200 characters, add a newline, and repeat this process with the remaining string:
function addNewlines(str) {
var result = '';
while (str.length > 0) {
result += str.substring(0, 200) + '\n';
str = str.substring(200);
}
return result;
}
You can do this is just one line of code.
var newStr = str.replace(/(.{200})/g, "$1\n")
Works well if you want prefixes or postfixes on every line as well
var newStr = str.replace(/(.{200})/g, "prefix- $1 -postfix\n")
Try this function it is just plain javascript. It takes the string and the number of characters to break after.
function addBreaks(s,c) {
var l = s.length;
var i = 0;
while (l > c) {
l = l-c;
i=i+c;
s = s.substring(0,c)+"\n"+s.substring(c);
}
return s;
}
var a=' aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa';
addBreaks(a,200);
http://javascript.about.com/library/blchunk.htm
$("#text").keyup(function()//Detect keypress in the textarea
{
var text_area_box =$(this).val();//Get the values in the textarea
var max_numb_of_words = 200;//Set the Maximum Number of chars
var main = text_area_box.length*100;//Multiply the lenght on words x 100
var value= (main / max_numb_of_words);//Divide it by the Max numb of words previously declared
if(text_area_box.length >= max_numb_of_words) {
//add break
}
return false;
});
If user is entering that text you can do the following:
Implement keydown event and whenever you reach the 200 count... insert a new line character and append it again.
If you are getting it from database, just before setting the value read that string and insert a new line character manually.
<!DOCTYPE html>
<html>
<head>
<title>HTML textarea Tag</title>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<textarea data-row-maxlength="200" data-limit-row-len="true"></textarea>
</body>
</html>
<script>
$("textarea[data-limit-row-len=true]").on("input focus keydown keyup",
function(event) {
var maxlength = $(this).data("row-maxlength");
var text = $(this).val();
var lines = text.split(/(\r\n|\n|\r)/gm);
for (var i = 0; i < lines.length; i++) {
if (lines[i].length > maxlength) {
lines[i] = lines[i].substring(0, maxlength) + "\n";
}
}
$(this).val(lines.join(''));
});
</script>
To anyone who came here looking to add the new line after each word rather than abruptly right at the character:
function addWordNewLine(str, breakpoint=80){
var words = str.split(" ");
var numChars = 0;
var mult = 1;
for(var i = 0; i < words.length; i++){
numChars += words[i].length;
// if( we hit a multiple of our breakpoint number )
if(numChars > breakpoint * mult){
words[i] += '\n';
mult++;
}
}
// As we re-arrange our text, make sure that a newline isn't followed
// with a space so that there's no odd single-space indenting
var p = words.join(" ").replaceAll("\n ", "\n");
return p;
}
var str = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
var formatted = addWordNewLine(str); // default breaks after word after every 80 chars
var wideFormatted = addWordNewLine(str, 200); // breaks after word after every 200 chars
精彩评论