在沒有jQuery的HTML textarea中顯示的行數（不是換行符）？

可能重複：
How to get number of rows in <textarea >?在沒有jQuery的HTML textarea中顯示的行數（不是換行符）？

我有一個textarea，我寫它7 lines只有2 new line character像下面，想象一下下面的代碼框是textarea，只有兩次進入鍵被按下。

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。 How to get the number of lines in a textarea?

我要計數的行數像爲Microsoft Word中從通道計數它。

沒有jQuery，請...

來源

2012-11-22 NazKazi

你試過了什麼？（StackOverflow的目的是幫助你解決問題，而不是爲你完成你的任務，你至少應該嘗試自己解決問題。） – jdigital

@jdigital我在谷歌中搜索很多關鍵字...但發現沒有辦法從哪裏開始......並且關於代碼什麼都不適用於我...... – NazKazi

是不是對[這個問題]最高的答案（http://stackoverflow.com/questions/1760629/how-to- get-number-of-rows-in-textarea）就是你想要的？ –

，你可以試試這個。到目前爲止我還沒有測試過，但我記得這應該可以正常工作。

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

先通舒爾給textarea的一個值的cols

，現在看看這個=

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

現在這應該正常工作。

UPDATE

你也可以確保刪除所有的「新線」的元素，或只是在最後一個字符，如果是字符串befor越來越長的「新行」。這樣就不會有不需要的附加行數。

此外一定不要設置文本框的「寬度」！這將導致一行中的文本走得更遠，然後是「cols」的值。這樣「count」值會給你行的數量，如果是cols值的最大行寬。所以用cols屬性設置文本框寬度的唯一方法。

更新2

我認爲，如果你想有一個無車路周圍有使用PHP或jQuery的沒有辦法。

另外第二個解決方案只是一個快速和骯髒的方式。你必須編寫一個邏輯來檢查每個單詞是否長於可用寬度，並檢查每行是否由於空間不足而放入下一行的單詞。

這將需要一些邏輯技巧，由於不活動，我現在不會編寫代碼。

如果你想要我發佈一個完整的Javascript，PHP或jQuery解決方案，請讓我知道。（我看不出有什麼理由不爲此使用jQuery）

來源

2012-11-22 20:23:33 Ace

我'空textarea'自帶12行...所以當我將寫7行，它會返回我12 ... – NazKazi

我找到了另一種方式，我正在測試它 – Ace

那裏你去我的朋友 – Ace

在沒有jQuery的HTML textarea中顯示的行數（不是換行符）？

回答

相關問題