So erhalten Sie Inhalte jeder Zeile über textarea ⇐ JavaScript

[Anonymous]

Wenn TextArea-Anzeigezeile 1! [Screenshot 2025-02-21 um 17.32.49.png] und Zeile 2 ist (http: // localhost: 9001/article/680x_4a9d1136-fafb-40DC-8A47 -72CA0B24BF46.png) , wie kann ich Inhalte von textarea von erhalten Reihe von Zeileninhalten. Das bedeutet aus dem Bild, von dem ich erwarte, dass ich Array wie unten < /p>
bekommen kann

Code: Select all

["![Screen Shot 2025-02-21 at 17.32.49.png]",
"(http://localhost:9001/article/680x_4a9d1136-fafb-40dc-8a47-72ca0b24bf46.png)"]

Code: Select all

function splitTextarea() {
const textarea = document.getElementById("myTextarea");
const text = textarea.value;

// Step 1: Split by hard line breaks (`\n`)
const lines = text.split("\n");
const renderedRows = []
// Step 2: For each paragraph, split into rows based on textarea width
// const rowsArray = [];
const tempElement = document.createElement("div");
tempElement.style.position = "absolute";
// tempElement.style.visibility = "hidden";
tempElement.style.overflowWrap = "break-word";
tempElement.style.whiteSpace = "pre-wrap"; // Preserve spaces and line breaks
tempElement.style.width = `${textarea.clientWidth}px`; // Match textarea width
tempElement.style.fontFamily = getComputedStyle(textarea).fontFamily; // Match font
tempElement.style.fontSize = getComputedStyle(textarea).fontSize; // Match font size
tempElement.style.lineHeight = getComputedStyle(textarea).lineHeight; // Match line height
// tempElement.style.padding = getComputedStyle(textarea).padding; // Match padding
// tempElement.style.boxSizing = "border-box"; // Match box sizing
document.body.appendChild(tempElement);

lines.forEach(line => {
if (line === '') {
// Handle blank lines
renderedRows.push('');
} else {
let start = 0;
while (start < line.length) {
let end = start;
while (end < line.length) {
const text = line.slice(start, end);
tempElement.textContent = line.slice(start, end);
const computedStyle = window.getComputedStyle(tempElement);
const height = computedStyle.height;
const heightInt = parseInt(height, 10);
// if (text === "2全国各地から厳選された有名焼き芋店やおいもスイーツの専門店が集結し、素材にこだわった極上の焼き芋や多彩な") {
//   console.log('heightInt', heightInt)
// }
console.log(text, heightInt)
if (heightInt > 19) {
// console.log('end,', end)
end = end - 1
break;
}
end++;
}
console.log("line", line.slice(start, end))
renderedRows.push(line.slice(start, end));

start = end;
}
}
});

// Clean up
// document.body.removeChild(tempElement);

console.log("Rows Array:", renderedRows);
return renderedRows;
}< /code>

![Screen Shot 2025-02-21 at 17.32.49.png](http://localhost:9001/article/680x_4a9d1136-fafb-40dc-8a47-72ca0b24bf46.png)


Split Textarea