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 general rule when the webpage is encoded according to Unicode (the pop-up page of "run code" is based on this encoding, And the pages generated by JS are all encoded according to this encoding) 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:
<Pre class = "code" rows = 5 cols = 30 id = abc> my grandfather heard that I want to bring my girlfriend to a phishing scam and want to meet her. I brought my girlfriend first. When I waited for my grandfather, I had caught a 18-kilogram-heavy bass. My grandfather arrived. I introduced my girlfriend to him and showed him the fish. Really good! He said, how to catch it? Use. I replied. That's amazing. He deliberately solemnly said that my generation should have at least a meal and a movie! </Textarea> select the <input name = start value = 3> line <input name = end value = 5> line <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]

04 What was written at the beginning of the year should be a comprehensive study at present ??
<Style> * {font-size: 12px ;} </style> <table> <tr> <td> <pre class = "code" id = "test" style = "width: 400px; height: 200px "onclick =" get_txt_pos () "onkeyup =" get_txt_pos () "> 1-1234567890 2-12345678901234567890 3-123456789012345678901234567890 4-1234567890123456789012345678901234567890 5-12345678901234567890123456789012345678901234567890 6-123456789012345678901234567890123456789012345678901234567890 7-1234567890123456789012345678901234567890123456789012345678901234567890 8-12345678901234567890123456789012345678901234567890123456789012345678901234567890 9-123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890 0-1234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890 </textarea> </td> <td width = "50"> </td> <td valign = "top"> <B> Current Position: </B> <B> Physical Row: </B> <B> Physical Column: </B> <B> Visible Row: </B> <B> Visible Column: </B> <B> Error Message: </B> <pre class = "code" id = "err" style = "width: 350px; height: 120px "> </textarea> </td> </tr> </table> <input type =" button "name =" textfield "onclick =" restore_txt () "value =" Restore Selection "> <table> <tr> <td> <B> CreateRange </B> <pre class =" code "id =" cr "style =" width: 400px; height: 200px "> </textarea> </td> <B> CreateTextRange </B> <pre class =" code "id =" ctr "style =" width: 400px; height: 200px "> </textarea> </td> </tr> <td> <B> CreateRange. getClientRects () </B> <pre class = "code" id = "cr_crt" style = "width: 400px; height: 200px "> </textarea> </td> <B> CreateTextRange. getClientRects () </B> <pre class = "code" id = "ctr_crt" style = "width: 400px; height: 200px "> </textarea> </td> </tr> <td> <B> CreateRange. getBoundingClientRect () </B> <pre class = "code" id = "cr_bcrt" style = "width: 400px; height: 200px "> </textarea> </td> <B> CreateTextRange. getBoundingClientRect () </B> <pre class = "code" id = "ctr_bcrt" style = "width: 400px; height: 200px "> </textarea> </td> </tr> </table>
[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.
<Pre class = "code" rows = 5 cols = 30 id = abc> Bound0 subconfirmation studio Bioinformatics-related business introduction [one-step multi-step biological information query] will be cumbersome step 1: Merge Biological Information Query, reduce manual jump between webpages. As long as the multi-step Biological Information Query Process can be clarified, it may be further implemented. [Batch data transcription and integration] include a large number of scattered documents in the database, organize and convert them into compliant formats. For example, you can include hundreds of complicated Word documents in a database. [Customize the Bound0 Eureka pre-selection database] using the Bound0 Eureka pre-selection database, you can preliminarily determine the composition of the sample, narrow down the processing scope of the further experiment, and make adjustments to the next experiment, or pre-select the best experimental scheme 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. Patent Applications for the core technologies of the Bound0 Eureka database have been accepted. Patent Application No.: 200610077985.3. Business essence of the custom Bound0 Eureka pre-selection database (Bound0 Eureka Preselector): 1. localized integration of custom public database content. 2. Customize database query methods and query items. 3. Custom analysis and statistics functions. 4. Customize the data sharing function. 5. Customize the teaching display function. 6. Customize other auxiliary functions. For example, the data content of the Bound0 Yeast Protein Eureka presser 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. The Bound0 Yeast Protein Eureka Preselector database has the following basic functions: (1) Eureka Preselector (main function): provides a list of qualified proteins 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. (2) display the biological information of proteins in a tree structure. (3) provides comments and guidance on standardized terms (GO Term) describing the cellular components, involved biological processes, and descriptive features of proteins in the form of search engines. (4) search engines are used to translate the IDs and names of proteins. (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. (6) automatically generate the link Code required for the preceding demonstration. (7) independently released data analysis accessories for data sharing. Eureka results saved on webpages can be processed. For more information, see bound0@tom.com </textarea> select the <input name = start value = 3> line to the <input name = end value = 5> line <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]