मेरे पास <textarea>
तत्व है। क्या मैं जावास्क्रिप्ट का उपयोग यह पता लगाने के लिए कर सकता हूं कि (उदाहरण के लिए) इसमें टेक्स्ट की 10 पंक्तियां हैं?जावास्क्रिप्ट का उपयोग कर <textarea > में पंक्तियों की संख्या कैसे प्राप्त करें?
उत्तर
आप जावास्क्रिप्ट डॉम के माध्यम से क्षेत्र तक पहुंच सकते हैं और बस न्यूलाइन अक्षरों की संख्या को गिन सकते हैं।
oArea = document.getElementById('myTextField');
var aNewlines = oArea.value.split("\n");
var iNewlineCount = aNewlines.length();
यह केवल
@ फ्रेंकी, ठीक है, लेकिन इसे सही तरीके से कैसे गणना करें? – Mask
यदि आप एक विकल्प हैं जो नई लाइनों की संख्या = पंक्तियों की संख्या –
अच्छी तरह से मुझे ऐसा करने का एक आसान तरीका मिला, लेकिन आपको सीएसएस में टेक्स्टरेरा की रेखा-ऊंचाई सेट करने की आवश्यकता होगी। मैंने स्क्रिप्ट ta.style.lineHeight
के अंदर लाइन ऊंचाई को पढ़ने की कोशिश की लेकिन यह एक मान वापस नहीं प्रतीत होता है।
सीएसएस
#ta { width: 300px; line-height: 20px; }
एचटीएमएल
<textarea id="ta">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque suscipit, nisl eget dapibus condimentum, ipsum felis condimentum nisi, eget luctus est tortor vitae nunc. Nam ornare dictum augue, non bibendum sapien pulvinar ut. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Cras congue congue purus, quis imperdiet tellus ornare in. Nulla facilisi. Nulla elementum posuere odio ut ultricies. Nullam tempus tincidunt elit eget posuere. Pellentesque sit amet tellus sapien. Praesent sed iaculis turpis. Nam quis nibh diam, sed mattis orci. Nullam ornare adipiscing congue. In est orci, consectetur in feugiat non, consequat vitae dui. Mauris varius dui a dolor convallis iaculis.</textarea>
स्क्रिप्ट
var taLineHeight = 20; // This should match the line-height in the CSS
var taHeight = ta.scrollHeight; // Get the scroll height of the textarea
ta.style.height = taHeight; // This line is optional, I included it so you can more easily count the lines in an expanded textarea
var numberOfLines = Math.floor(taHeight/taLineHeight);
alert("there are " + numberOfLines + " lines in the text area");
अद्यतन: धन्यवाद कीड़े बाहर काम करने के लिए @Pebbl करने के लिए, इस कोड को प्राप्त करने के लिए आवश्यक है पाठ सामग्री की ऊंचाई (demo)
var calculateContentHeight = function(ta, scanAmount) {
var origHeight = ta.style.height,
height = ta.offsetHeight,
scrollHeight = ta.scrollHeight,
overflow = ta.style.overflow;
/// only bother if the ta is bigger than content
if (height >= scrollHeight) {
/// check that our browser supports changing dimension
/// calculations mid-way through a function call...
ta.style.height = (height + scanAmount) + 'px';
/// because the scrollbar can cause calculation problems
ta.style.overflow = 'hidden';
/// by checking that scrollHeight has updated
if (scrollHeight < ta.scrollHeight) {
/// now try and scan the ta's height downwards
/// until scrollHeight becomes larger than height
while (ta.offsetHeight >= ta.scrollHeight) {
ta.style.height = (height -= scanAmount)+'px';
}
/// be more specific to get the exact height
while (ta.offsetHeight < ta.scrollHeight) {
ta.style.height = (height++)+'px';
}
/// reset the ta back to it's original height
ta.style.height = origHeight;
/// put the overflow back
ta.style.overflow = overflow;
return height;
}
} else {
return scrollHeight;
}
}
var calculateHeight = function() {
var ta = document.getElementById("ta"),
style = (window.getComputedStyle) ?
window.getComputedStyle(ta) : ta.currentStyle,
// This will get the line-height only if it is set in the css,
// otherwise it's "normal"
taLineHeight = parseInt(style.lineHeight, 10),
// Get the scroll height of the textarea
taHeight = calculateContentHeight(ta, taLineHeight),
// calculate the number of lines
numberOfLines = Math.ceil(taHeight/taLineHeight);
document.getElementById("lines").innerHTML = "there are " +
numberOfLines + " lines in the text area";
};
calculateHeight();
if (ta.addEventListener) {
ta.addEventListener("mouseup", calculateHeight, false);
ta.addEventListener("keyup", calculateHeight, false);
} else if (ta.attachEvent) { // IE
ta.attachEvent("onmouseup", calculateHeight);
ta.attachEvent("onkeyup", calculateHeight);
}
+1, यह अब तक का सबसे विश्वसनीय दृष्टिकोण है। एक नोट: सुनिश्चित करें कि textarea 'पंक्तियों = 1' के साथ शुरू होता है, या फिर इसकी' scrollHeight' कृत्रिम रूप से उच्च हो सकती है। –
@Mottie '। स्टाइल' ऑब्जेक्ट केवल इनलाइन शैलियों को वापस कर देगा। गणना मूल्य प्राप्त करने के लिए आपको पुराने विंडो के लिए 'window.getComputedStyle' और 'Elm.currentStyle' पर फ़ॉलबैक का उपयोग करना चाहिए। उस +1 के अलावा :) – Pebbl
इनपुट @pebbl के लिए धन्यवाद! मैंने उपरोक्त सुझावों को जोड़ दिया है और [डेमो] (http://jsfiddle.net/Mottie/PfD7L/) बनाया है। ध्यान दें कि जब आप आधुनिक ब्राउज़र में टेक्स्टरेरा का मैन्युअल रूप से आकार बदलते हैं, तो आकार की ऊंचाई से मेल खाने के लिए लाइनों की संख्या बदल जाएगी, न कि सामग्री। – Mottie
function countLines(area,maxlength) {
// var area = document.getElementById("texta")
// trim trailing return char if exists
var text = area.value.replace(/\s+$/g, "")
var split = text.split("\n")
if (split.length > maxlength) {
split = split.slice(0, maxlength);
area.value = split.join('\n');
alert("You can not enter more than "+maxlength.toString()+" lines");
}
return false;
}
यह एक सरल है और परीक्षण एक
बस एक js लाइन:
var rows = document.querySelector('textarea').value.split("\n").length;
ओएस के आधार पर, मैंने इस के साथ समस्याओं में भाग लिया है। विशेष रूप से \ r, \ r \ n, \ n \ r, और \ n के बीच का अंतर। मुझे बिल्कुल याद नहीं है, लेकिन वास्तव में इसे पूरी तरह से करना मुश्किल था। – mike
क्या होगा अगर कई रेखाएं न्यूलाइन अक्षरों की वजह से नहीं हैं, लेकिन क्योंकि एक पंक्ति अगली पंक्ति में बहती है? – brandaemon
- 1. एचटीएमएल <textarea>
- 2. जावास्क्रिप्ट के साथ <textarea> समाशोधन?
- 3. <textarea> में टेक्स्ट स्वरूपित करें?
- 4. स्प्रिंग</textarea> टैग
- 5. tinymce का उपयोग कर textarea की चौड़ाई कैसे सेट करें?
- 6. PostgreSQL में हटाई गई पंक्तियों की संख्या कैसे प्राप्त करें?
- 7. sqlalchemy में प्रभावित पंक्तियों की संख्या कैसे प्राप्त करें?
- 8. ग्रिड व्यू की पंक्तियों की संख्या कैसे प्राप्त करें?
- 9. <textarea> क्षैतिज नियम
- 10. जावास्क्रिप्ट का उपयोग कर एचटीएमएल <td> मूल्य कैसे प्राप्त करें?
- 11. <इनपुट प्रकार = 'टेक्स्ट' /> और <textarea> चौड़ाई
- 12. जावास्क्रिप्ट ऑब्जेक्ट में फ़ील्ड की संख्या कैसे प्राप्त करें?
- 13. जावास्क्रिप्ट किसी ऑब्जेक्ट में बच्चों की संख्या कैसे प्राप्त करें
- 14. जावास्क्रिप्ट का उपयोग कर स्ट्रिंग में कोई संख्या कैसे खोजें?
- 15. कोडइग्निटर सक्रिय रिकॉर्ड - लौटाई गई पंक्तियों की संख्या प्राप्त करें
- 16. mongodb का उपयोग करके पंक्तियों की प्रभावित संख्या कैसे प्राप्त करें, PHP ड्राइवर
- 17. शक्तियों में पंक्तियों की संख्या की गणना कैसे करें
- 18. <textarea/> टैग "निगल" एचटीएमएल
- 19. प्रतिबिंब का उपयोग कर System.Linq.Enumerable.Count <> IENumerable <T> पर कैसे आक्रमण करें?
- 20. आप जावास्क्रिप्ट का उपयोग कर एचटीएमएल एन्कोड कैसे करते हैं?
- 21. ऑक्टेव में मैट्रिक्स की पंक्तियों का अर्थ कैसे प्राप्त करें?
- 22. LINQ का उपयोग कर डेटासेट से पंक्तियां चुनें, जहां पंक्तियों की सूची सूची <T>
- 23. ओरेकल एसक्यूएल में पंक्तियों की संख्या का चयन करें?
- 24. SQLite - डेटाबेस में पंक्तियों की संख्या प्राप्त करना
- 25. जावास्क्रिप्ट में सीपीयू कोर की संख्या प्राप्त करें?
- 26. जावास्क्रिप्ट का उपयोग कर तत्व की अस्पष्टता कैसे प्राप्त करूं?
- 27. मैं जावास्क्रिप्ट में <script> में <script> के चर का उपयोग कैसे कर सकता हूं?
- 28. जावास्क्रिप्ट को HTML तालिका की पंक्तियों की संख्या प्राप्त करने के लिए
- 29. जावास्क्रिप्ट - <option>
- 30. जावास्क्रिप्ट का उपयोग कर कॉलर तत्व कैसे प्राप्त करें?
आप अपने प्रश्न को स्पष्ट करने के लिए तो यह नहीं लगता है जैसे आप कर रहे हैं चाहते हो सकता है 'textarea' तत्व से' पंक्तियों = 'विशेषता को वापस करने का प्रयास कर रहा है। –
आप ऐसा क्यों करना चाहते हैं? मुझे एक बुरा आवश्यकता विनिर्देश समझ में आता है। – Randell