Some research materials on the intuitive line feed of textarea

Two days ago, I studied the line feed rule of textarea, which is quite complicated:

How to obtain the intuitive line depends not only on the Cols size, but also on the webpage encoding method.
Cols = "30" textarea, in fact, each line can contain 29 half-width characters, the number of full-width characters is not necessarily, it depends on the webpage encoding method.
In ie6.0, the line feed of the intuitive line occurs at the Red Letter (the red letter is folded to the next line ).

Dddddddddddddd meters ddddddddddddddddddddd // The continuous half-width content after the full-width corner is treated as a complete word. If the remaining position cannot accommodate the word length, a new line is required. This is a special rule.

The webpage is encoded in Unicode ("run"Code"The pop-up page is based on this encoding, And the JS generated pages are all based on this encoding) the general rule is

("Full" means that a new line is required no matter whether it is followed by full-width or half-width characters)

123456789012345678901234567890 // 29 the half corner is full
80 or 90, 80 or 90
80 or 90, 80 or 90
80 or 90, 80 or 90
0 80 or 90, 80 or 90
0 80 or 90, 80 or 90
0 may 80 or 90, 80 or 90
01 August 5, 80 or 90, 80 or 90
01 May 80 or 90, 80 or 90)
012 may 80 or 90, 80 or 90
012 may 80 or 90 80 or 90 may
0123 80 or 90 80 or 90.
0123 80 or 90, 80 or 90)
01234 80 or 90 80 or 90
01234 80 or 90 80 or 90
012345 80 or 90 80 or 90
012345 80 or 90, 80 or 90)
0123456 80 or 90 80 or 90
0123456 80 or 90 80 or 90
01234567 80 or 90, 80 or 90
01234567 80 or 90, 80 or 90
012345678 80 or 90, 80 or 90
012345678 80 or 90 80 or 90)
0123456789 80 or 90, 80 or 90

......

0 80 or 90, 80 or 90 ), this article can be obtained from the full corner of 15 and the full corner of 3

......

0 80 or 90, 1234, 80 or 90 ), this article can be obtained from 14 full-width and 5 full-width.

......

01 August 5, 80 or 90, 234, 80 or 90 ), this article can be obtained from 14 full-width and 5 full-width.

......
The line feed position is related not only to the entire line of text before the line feed position, but also to the red letter (the full-angle text is often folded to the next line because it cannot be squeezed at the end of the uplink ).

Summary:

Code: [copy to clipboard] x fullwidth, y halfwidth = x fullwidth, Y-1 halfwidth = x fullwidth, y-N half-width can contain N half-width continuous characters (when n half-width is greater than ).
So we can figure out all the situations that are "full.

Cols = 30: The page is listed as full when it is encoded in UNICODE:

17. fullwidth
16 fullwidth, 1 halfwidth
15 fullwidth, 3 halfwidth
14 fullwidth, 5 halfwidth
13 fullwidth, 7 halfwidth
12-width, 8-Width
11 fullwidth, 10 halfwidth
10 fullwidth, 12 halfwidth
9 fullwidth, 13 halfwidth
8-width, 15-Width
7-width, 17-Width
6 fullwidth, 19 halfwidth
5 fullwidth, 21 halfwidth
4 fullwidth, 22 halfwidth
3 fullwidth, 24 halfwidth
2 fullwidth, 26 halfwidth
1 fullwidth, 28 halfwidth
29 halfwidth

When a line breaks according to the special rule A, it is easy to measure all the situations that are "full:
For example, in 80 or 90, 012345678912, 80 or 90
80 or 90, 0123456789123, 80 or 90, // The red letter is wrapped in a according to the special rule. The blue word is wrapped in 9 corners, and the half corner is full of lines.

Cols = 30. When the webpage is encoded as gb2312, the "full" rule is different:

14 fullwidth, 1 halfwidth
13 fullwidth, 3 halfwidth
12-width, 5-Width
11 fullwidth, 7 halfwidth
10 fullwidth, 9 halfwidth
9 fullwidth, 11 halfwidth
8-width, 13-Width
7-width, 15-Width
6 fullwidth, 17 halfwidth
5 fullwidth, 19 halfwidth
4 fullwidth, 21 halfwidth
3 fullwidth, 23 halfwidth
2 fullwidth, 25 halfwidth
1 fullwidth, 27 halfwidth
29 halfwidth

In this way, the "full" rule can be determined only through experiments based on the webpage encoding method and cols.

Calculate the number of full-width and half-width characters from the beginning of the textarea content. A determines the first position of the intuitive line feed based on the "full" rule and special rules, calculate the number of full-width and half-width characters from the second line (including physical and intuitive rows). Based on the "full" rule and special rule A, determine the location of the second intuitive line feed ...... Continue until the end of the textarea content. In this way, we can get all the line breaks.

Of course, this experiment is not necessary or possible during actual application. For example, if you select row X of textarea to row y, you still have no idea what the official solution is. I did this:<Textarea rows = "5" Cols = "30" id = "ABC"> <br/> my grandfather heard that I want to take my girlfriend to fishing and want to meet her. I brought my girlfriend first. When I waited for my grandfather, I had caught a 18-kilogram-heavy bass. <Br/> when my grandfather arrived, I introduced his girlfriend to him and showed him the fish. <Br/> really good! He said, how to catch it? <Br/> use a worm. I replied. <Br/> that's amazing. He deliberately solemnly said, <br/> my generation should have at least one meal and a movie! <Br/> select the <input name = "start" value = "3"> line <input name = "end" value = "5"> <br/> <button onclick = "SELE (start. value, end. value) "> select </button> <br/>
[Ctrl + A select all Note: If you need to introduce external JS, You need to refresh it to execute]

04 What was written at the beginning of the year should be a comprehensive study at present ?? <Br/> <style> * {font-size: 12px ;} </style> <p> <br/> <Table> <tr> <TD> <p> <textarea id = "test" style = "width: 400px; height: 200px "onclick =" get_txt_pos () "onkeyup =" get_txt_pos () "> <br/> 1-1234567890 <br/> 2-12345678901234567890 <br/> 3-123456789012345678901234567890 <br/> 4-1234567890123456789012345678901234567890 <br/> 5-12345678901234567890123456789012345678901234567890 <br/> 6-123456789012345678901234567890123456789012345678901234567890 <br/> 7-1234567890123456789012345678901234567890123456789012345678901234567890 <br/> 8-12345678901234567890123456789012345678901234567890123456789012345678901234567890 <br/> 9-123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890 <br/> 0-1234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890 </P> <p>

Current position:

Physical row:

Physical column:

Visible row:

Visible column:

Error message:

createRange	createTextRange
createRange. getclientrects ()	createTextRange. getclientrects ()
createRange. getboundingclientrect ()	createTextRange. getboundingclientrect ()

[Ctrl + A select all Note: If you need to introduce external JS, You need to refresh it to execute]

According to a website anonymously reproduced page (http://dl.pconline.com.cn/html_2/4/545/id=38457&pn=0.html) on the netizen message, the above "JS implementation of any line of the text domain selected" sample code has a bug: that is, when the scroll bar is not at the top, running the sample code will cause an error. Corrected: only one line of code is added.

Code:
SRC. scrolltop = 0 // make sure that the scroll bar is at the top of the page when the number of start rows is reached.<Textarea rows = "5" Cols = "30" id = "ABC"> <br/> bound0 subvalidation studio Bioinformatics-related business introduction </P> <p> [multiple step-by-Step biological information query] </P> <p> merge tedious multi-step Biological Information Query into one step, reduce manual jump between webpages. </P> <p> as long as the multi-step Biological Information Query Process can be clarified, it can be further implemented. </P> <p> [batch data transcription and integration] </P> <p> collect, sort, and convert a large number of scattered documents into a database in a compliant format. </P> <p> for example, you can include hundreds of complicated Word documents in the database. </P> <p> [customize the bound0 Eureka pre-selection database] </P> <p> use the bound0 Eureka pre-selection database to preliminarily determine the composition of the sample, narrow down the scope of further experiments, make adjustments to the following experiment links, or pre-select the best experiment scheme, so as to shorten the research and development cycle and save manpower and material resources. Some hypotheses can also be preliminarily verified, and new hypotheses can be created. At the same time, it makes the communication and teaching process easier and more convenient. </P> <p> patent applications for the core technologies of the bound0 Eureka pre-selected database have been accepted. Patent Application No.: 200610077985.3. </P> <p> business essence of the bound0 Eureka pre-selection database (bound0 Eureka preselector): <br/> 1. localized integration of custom public database content. <Br/> 2. Customize database query methods and query items. <Br/> 3. Custom analysis and statistics functions. <Br/> 4. Customize the data sharing function. <Br/> 5. Customize the teaching display function. <Br/> 6. Customize other auxiliary functions. </P> <p> for example, the data content of the bound0 Yeast Protein Eureka pre-selection database integrates part of the data in the SGD database (Saccharomyces genome database, yeast genome database http://www.yeastgenome.org. A total of 6713 proteins are contained. </P> <p> the bound0 Yeast Protein Eureka preselected database has the following basic functions: <br/> (1) Eureka preselector (main function ): A list of qualified proteins is provided based on the conditions. Rank the protein in the list based on the closeness between the protein features and the target features. Output and save Eureka results on a webpage. Compare and analyze the saved results. <Br/> (2) display the biological information of proteins in a tree structure. <Br/> (3) standardized terms used to describe the cellular components, involved biological processes, molecular functions, and other descriptive features of proteins in the form of search engines (go term) provides comments and guidance. <Br/> (4) search engines are used to translate various IDS and names of proteins. <Br/> (5) Implement the custom Eureka: // protocol on the computer where the bound0 Yeast Protein Eureka pre-selection database is installed. You can use hyperlinks (text links, image hotspot links, etc.) on your webpage to dynamically call the content in the database for demonstration. <Br/> (6) automatically generate the link Code required for the preceding demonstration. <Br/> (7) independently released data analysis accessories for data sharing. Eureka results saved on webpages can be processed. </P> <p> For more information, please contact the bound0@tom.com <br/> select the <input name = "start" value = "3"> line to input name = "end" value = "5"> line <br/> <button onclick = "SELE (start. value, end. value) "> select </button>
[Ctrl + A select all Note: If you need to introduce external JS, You need to refresh it to execute]