Anzahl der angezeigten Zeilen (keine Zeilenumbrüche) in einem HTML-Textfeld ohne jQuery?

Question

Mögliche Duplizieren:
How to get number of rows in <textarea >?

Ich habe ein textarea und ich schreibe 7 lines in es nur mit 2 new line character wie unten, stellen Sie sich vor der folgende Code-Box ein textarea ist und nur die zweimal eingeben Taste wird gedrückt.

A text box, text field or text entry box is a kind of widget used when building 
a graphical user interface (GUI). A text box purpose is to allow the user to 
input text information to be used by the program. 
User-interface guidelines recommend a single-line text box when only one line of 
input is required, and a multi-line text box only if more than one line of input 
may be required. 
Non-editable text boxes can serve the purpose of simply displaying text. 

Nach ein paar mehr Zeilen zu schreiben jetzt, wenn die textarea line countn ist. Wie kann ich den Wert von n berechnen?

Bitte seien Sie klar, bevor Sie die Frage beantworten. Ich möchte nicht zählen, wie viele new line characters in meinem Text wie dieser sind. How to get the number of lines in a textarea?

Ich will es die Anzahl der Zeilen so ähnlich wie Microsoft Word Zahl zählen aus einer Passage.

keine jQuery bitte ...

Answer 1

Sie dies ausprobieren konnten. Ich habe es bisher nicht getestet, aber ich erinnere mich, das sollte gut funktionieren.

var lineHeight = document.getElementById("yourTextarea").style.lineHeight; 
var scrollHeight = document.getElementById("yourTextarea").scrollHeight; 
document.getElementById("yourTextarea").style.height = scrollHeight; // this is just for showing purposes 
var numLines = Math.floor(scrollHeight/lineHeight); 

sollte dies der einfachste Weg sein, denke ich.

EDIT

so ist hier die Antwort, so einfach, wie es ist: D

erste make shure das Textfeld einen Wert für cols

und jetzt check this out zu geben, =

<textarea id="mytext" cols="10" rows="12"> 
</textarea> 
<input type="button" value="Count Rows" onclick="countRows();"/> 
<script type="text/javascript"> 
function countRows() { 
    var stringLength = document.getElementById("mytext").value.length; 
    var count = Math.ceil(stringLength/document.getElementById("mytext").cols); 
    // just devide the absolute string length by the amount of horizontal place and ceil it 
    alert(count); 
} 
</script> 

jetzt sollte dies genauso funktionieren wie es sollte.

UPDATE

Sie können auch sicherstellen, dass alle „neue Zeile“ Elemente oder einfach nur das letzte Zeichen zu entfernen, wenn sie vor dem Erhalten der Länge eine „neue Linie“ in der Zeichenfolge ist. Auf diese Weise werden keine unerwünschten zusätzlichen Zeilen gezählt.

AUCH achten Sie darauf, die "Breite" des Textfelds nicht zu setzen !! Dies führt dazu, dass der Text in einer Zeile über den Wert von "cols" hinausgeht. Auf diese Weise gibt der "count" -Wert Ihnen die Anzahl der Zeilen an, wenn Sie mit einem cols-Wert für maximale Zeilenbreite arbeiten würden. also die einzige Möglichkeit, die Breite des Textfelds mit dem Attribut cols festzulegen.

UPDATE 2

ich denke, wenn Sie eine nicht Buggy Art und Weise mögen, gibt es keine Möglichkeit, PHP oder jQuery um verwenden.

auch die zweite Lösung ist nur ein schneller und schmutziger Weg. Sie müssten eine Logik programmieren, die jedes Wort prüft, wenn es länger ist als die entfernbare Breite, und außerdem jede Zeile auf Wörter überprüfen, die wegen zu wenig Platz in die nächste Zeile gesetzt wurden.

Dies erfordert einige logische Fähigkeiten und aufgrund von Inaktivität werde ich den Code für jetzt nicht schreiben.

Wenn Sie möchten, dass ich eine vollständige Javascript, PHP oder jQuery Lösung posten, lassen Sie es mich bitte wissen. (Ich sehe keinen Grund, warum jQuery nicht für diese verwenden)