9

重複の可能性:
<textarea>の行数を取得するにはどうすればよいですか?

私はaを持っていて、以下のようにtextarea書きます。次のコードボックスがaであり、Enterキーが2回だけ押されたと想像してください。7 lines2 new line charactertextarea

 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.

もう少し行を書いた後、今textarea line countならn。の値を計算するにはどうすればよいnですか?

質問に答える前に明確にしてください。new line charactersこのように私のテキストにいくつあるかを数えたくありません。テキストエリアの行数を取得するにはどうすればよいですか?

MicrosoftWordがパッセージから数えるのと同じように行数を数えたい。

jQueryはありません...

4

1 に答える 1

3

これを試すことができます。これまでのところテストしていませんが、これでうまくいくはずです。

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 );

これは私が考える最も簡単な方法です。

編集

だからここに答えがあります、それは簡単です:D

最初に、テキストエリアにcolsの値を与えるために shure を作成します

そして今これをチェックしてください=

<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>

これで正常に動作するはずです。

アップデート

長さを取得する前に、すべての「改行」要素または文字列の「改行」である場合は最後の文字のみを削除することもできます。このようにして、不要な追加行がカウントされなくなります。

また、テキストボックスの「幅」を設定しないでください!! これにより、行のテキストが「cols」の値よりも先に進みます。そうすれば、「カウント」値は、列の値の最大行幅がある場合、行の数を示します。したがって、cols 属性を使用してテキストボックスの幅を設定する唯一の方法です。

更新 2

バグのない方法が必要な場合は、PHP または jQuery を使用する方法はないと思います。

また、2番目の解決策は、迅速で汚い方法です。各単語が離れた幅よりも長いかどうかをチェックし、スペース不足のために次の行に配置された単語がないか各行をチェックするロジックをコーディングする必要があります。

これにはある程度の論理的スキルが必要であり、非アクティブであるため、今のところコードを記述しません。

完全な Javascript、PHP、または jQuery ソリューションを投稿してほしい場合は、お知らせください。(これにjQueryを使用しない理由がわかりません)

于 2012-11-22T20:23:33.277 に答える