A method for generating rich text

Abstract

The present invention provides a method for generating rich text, comprising the following steps: two text input methods are configured for an input box, namely: a free input method and an external selection input method; the currently activated text input method of the input box is monitored, and if it is monitored that the free input method is activated, the processing of free input text is executed; if the external selection input method is monitored, the processing of external selection input text is executed. The present invention can simply and efficiently achieve the effect that the text input by the user is inconsistent with the displayed and published text. At the same time, it can effectively reduce the user's usage cost, can more flexibly adapt to business requirements, and can more accurately implement the text editing function of text parsing and display.

Description

Technical Field

[0001] The present invention belongs to the technical field of text processing, and particularly relates to a method for generating rich text. Background Art

[0002] In the prior art, when a user inputs text through an input box, since the text input by the user does not meet a certain requirement, it needs to be transformed and converted into text that meets the requirements before being displayed. For example, in the scenario of comment publishing, the user inputs text A through the input box, and some words in text A need to be blocked or replaced. Therefore, the text finally published is text B. That is to say, the text A input by the user is not exactly the same as the text B finally published. Currently, the above technology is mainly implemented in the following way: customizing fixed grammar rules, such as Markdown. Markdown is a lightweight markup language that allows users to write documents in a plain text format that is easy to read and write, and then convert them into valid HTML documents. This language absorbs many features of plain text markup already existing in emails. By enabling users to input according to this grammar rule, the effect of inconsistent input text and displayed text is achieved. However, this technology has the following problems: it requires users to master a certain grammar rule, which brings inconvenience to users; in addition, since the input of users cannot be effectively restricted, errors are likely to occur. Summary of the Invention

[0003] In view of the defects existing in the prior art, the present invention provides a method for generating rich text, which can effectively solve the above problems.

[0004] The technical solution adopted by the present invention is as follows:

[0005] The present invention provides a method for generating rich text, including the following steps:

[0006] Step 1, configure two text input methods for the input box, namely: free input method and external selection input method;

[0007] Monitor the currently activated text input method of the input box. If it is monitored that the free input method is activated, then execute Step 2; if it is monitored that the external selection input method is activated, then execute Step 3;

[0008] Step 2, processing of free input text:

[0009] Step 2.1, when the free input method is activated, read the cursor position at this time as the starting position of free text input; when the termination condition for free text input preset is met, read the cursor position at this time as the termination position of free text input;

[0010] From the input box, read the text between the start position of the free text input and the end position of the free text input as the parent text;

[0011] Step 2.2, pre-store a node mapping relationship table; the node mapping relationship table is used to store the mapping relationship between the text node input by a specific user and the text node to be published; the text node input by the specific user is called the original text node text_node_old, and the text node to be published is called the new text node text_node_new;

[0012] Use the preset business grammar rules to parse the parent text to determine whether the parent text can match the original text node text_node_old in the node mapping relationship table. If not, do not process the parent text this time and return to step 1; if yes, execute step 2.3;

[0013] Step 2.3, for each original text node text_node_old matched in the parent text, a unique corresponding text node tag text_node_tag is generated;

[0014] Wherein: the text node tag text_node_tag encapsulates the mapping relationship between the original text node text_node_old and the corresponding new text node text_node_new;

[0015] Step 2.4, obtaining the current position S1 of the cursor in the input box;

[0016] Step 2.5, obtaining the cursor offset from the current cursor position S1 to the target position; wherein the target position refers to the end position of any original text node text_node_old;

[0017] Step 2.6, create a virtual cursor, move the virtual cursor from the current cursor position S1 to the target position according to the cursor offset, insert the corresponding text node tag text_node_tag into the position of the virtual cursor, and at the same time, set the tag attributes of the text node tag text_node_tag as follows: the tag is in a hidden state and is not visible to the input box; the tag is out of the document flow state and does not occupy page space;

[0018] Step 2.7, moving the virtual cursor to the end position of the text node tag text_node_tag inserted this time;

[0019] Then, move the virtual cursor to the end position of the next original text node text_node_old, complete the insertion operation of the corresponding text node label text_node_tag, and execute step 2.8 until all original text nodes text_node_old of the parent text are processed;

[0020] Step 2.8, for the parent text with corresponding text node labels text_node_tag inserted at different positions, replace the corresponding original text node text_node_old with the new text node text_node_new within the text node label text_node_tag to generate the final rich text and save it;

[0021] Step 3, processing of the externally selected input text:

[0022] Step 3.1, pre-store a preset text mapping relationship table; the preset text mapping relationship table is used to store the mapping relationship from each preset text text_old to the text text_new to be published;

[0023] Step 3.2, when the external selection input method is activated, directly obtain the preset text text_old of the external selection input; then, search the preset text mapping relationship table to obtain the text text_new corresponding to the preset text text_old;

[0024] Step 3.3, generate a preset text label text_tag uniquely corresponding to the preset text text_old, and then execute step 3.4;

[0025] Wherein: in the preset text label text_tag, the mapping relationship between the preset text text_old and the corresponding text text_new to be published is encapsulated;

[0026] Step 3.4, display the preset text text_old in the input box; obtain the current cursor position S1 of the cursor in the input box;

[0027] Step 3.5, obtain the cursor offset from the current cursor position S1 to the target position; wherein, the target position refers to the end position of the preset text text_old;

[0028] Step 3.6, create a virtual cursor, move the virtual cursor from the current cursor position S1 to the target position according to the cursor offset, insert the corresponding preset text label text_tag at the position where the virtual cursor is located, and at the same time, set the label attribute of the preset text label text_tag as: the label is in a hidden state and invisible to the input box; the label is in a state of being out of the document flow and does not occupy page space;

[0029] Step 3.7, move the virtual cursor to the termination position of the preset text tag text_tag inserted this time;

[0030] Step 3.8, directly replace the preset text text_old with the text to be published text_new within the preset text tag text_tag to generate the final rich text and save it.

[0031] Preferably, the free input method refers to the keyboard input method.

[0032] Preferably, the external selection input method means that input selection buttons are configured outside the input box, and the input selection buttons provide multiple preset texts. When any one of the preset texts is selected, it is directly filled into the input box.

[0033] Preferably, both the text node tag text_node_tag and the preset text tag text_tag have special placeholders.

[0034] Preferably, the current cursor position S1 in the input box is obtained by the following method:

[0035] Judge whether the input box is currently in the focused state. If it is in the focused state, directly locate the current cursor position S1 from the input box, and when in the focused state, record the current cursor position S1 in real time;

[0036] If it is not in the focused state, it is in the unfocused state. Judge whether the input box has been clicked. If not, directly use the starting position of the input box as the current cursor position S1; if so, use the last recorded cursor position before the input box loses focus as the current cursor position S1.

[0037] A method for generating a rich text provided by the present invention has the following advantages:

[0038] The present invention can simply and efficiently achieve the effect that the user input text is inconsistent with the displayed published text. At the same time, it can effectively reduce the user's usage cost, can more flexibly adapt to business requirements, and can more accurately implement the text editing function of text parsing and display. Description of the Drawings

[0039] Figure 1 It is a schematic flowchart of a method for generating a rich text provided by the present invention. Detailed Embodiments

[0040] In order to make the technical problems, technical solutions and beneficial effects solved by the present invention more clearly understood, the present invention will be further described in detail below with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present invention and are not used to limit the present invention.

[0041] The present invention mainly relates to the field of H5 applications in the Web front-end. It mainly realizes the effect that the user input text is inconsistent with the displayed and published text simply and efficiently for some B-end or C-end products. At the same time, it can effectively reduce the user's usage cost, be more flexible in adapting to business requirements, and more accurately realize the text editing function of text parsing and display.

[0042] Reference Figure 1 , the present invention provides a method for generating rich text, including the following steps:

[0043] Step 1, configure two text input methods for the input box, namely: free input method and external selection input method;

[0044] Among them, the free input method includes but is not limited to the keyboard input method, and the text input through the free input method is ordinary text. The external selection input method means that an input selection button is configured outside the input box, and the input selection button provides a variety of preset texts. When any one of the preset texts is selected, it is directly filled into the input box. Through the external selection input method, the input is preset special text.

[0045] Monitor the currently activated text input method of the input box. If it is monitored that the free input method is activated, execute step 2; if it is monitored that the external selection input method is activated, execute step 3;

[0046] In the present invention, different processing logics are adopted for the free input method and the external selection input method respectively to realize the generation of rich text.

[0047] Step 2, processing of free input text:

[0048] Step 2.1, when the free input method is activated, read the cursor position at this time as the starting position of text free input; when the termination condition of text free input set in advance is met, read the cursor position at this time as the termination position of text free input;

[0049] Read the text between the starting position of text free input and the termination position of text free input from the input box as the parent text;

[0050] Step 2.2, pre-store a node mapping relationship table; the node mapping relationship table is used to store the mapping relationship between the text node input by a specific user and the text node to be published; the text node input by the specific user is called the original text node text_node_old, and the text node to be published is called the new text node text_node_new;

[0051] Use the preset business grammar rules to parse the parent text to determine whether the parent text can match the original text node text_node_old in the node mapping relationship table. If not, do not process the parent text this time and return to step 1; if yes, execute step 2.3;

[0052] Step 2.3, for each original text node text_node_old matched in the parent text, a unique corresponding text node tag text_node_tag is generated;

[0053] Among them: the text node tag text_node_tag encapsulates the mapping relationship between the original text node text_node_old and the corresponding new text node text_node_new; the text node tag text_node_tag can set its class name to a special constant, such as customClassName.

[0054] Step 2.4, obtaining the current position S1 of the cursor in the input box;

[0055] Step 2.5, the cursor offset from the current cursor position S1 to the target position can be obtained through the selection.anchorOffset function; wherein the target position refers to the end position of any original text node text_node_old;

[0056] Step 2.6, create a virtual cursor, move the virtual cursor from the current cursor position S1 to the target position according to the cursor offset, and use range.insertNode to insert the corresponding text node tag text_node_tag into the position of the virtual cursor. At the same time, set the tag attributes of the text node tag text_node_tag as follows: the tag is in a hidden state and is not visible to the input box; the tag is out of the document flow and does not occupy page space;

[0057] Step 2.7, moving the virtual cursor to the end position of the text node tag text_node_tag inserted this time;

[0058] Then, move the virtual cursor to the end position of the next original text node text_node_old, complete the insertion operation of the corresponding text node label text_node_tag, and perform step 2.8 until all original text nodes text_node_old of the parent text are processed;

[0059] Step 2.8, for the parent text where the corresponding text node labels text_node_tag are inserted at different positions, replace the corresponding original text nodes text_node_old with the new text nodes text_node_new within the text node labels text_node_tag to generate the final rich text and save it.

[0060] In the present invention, the function and significance of setting the virtual cursor are as follows: for the cursor actually displayed in the input box, its cursor movement is controlled by the user; in the background, the present invention sets a virtual cursor and inserts the text node label text_node_tag at the corresponding position by moving the virtual cursor to different positions. Therefore, during the process of inserting the text node label text_node_tag in the background, the position of the cursor actually displayed in the input box will not change, and it will not affect or interfere with the user's input experience using the input box.

[0061] In addition, in the present invention, the text node labels text_node_tag inserted in the background are in a hidden state and out of the document flow state. Therefore, although the operation of inserting the text node label text_node_tag is performed in the background, since it will not be displayed in the input box, the user will not see the text node label text_node_tag, and thus it will not affect or interfere with the user's input experience using the input box.

[0062] By combining the virtual cursor and the technology of setting the attributes of the text node label text_node_tag, the present invention does not need to copy the text in the input box again in the background and then perform the label insertion operation, which reduces the complexity of background operations and the space occupation, and at the same time, it will not affect or interfere with the user's input experience using the input box at all.

[0063] As a specific implementation method, the present invention can combine the advantages of markdown and rich text editing through the native contentEditable attribute to more flexibly adapt to the business. To implement this function, it is necessary to record the position of the user's cursor and continuously adjust the cursor position when the input box gains focus and data is inserted to prevent data errors from affecting subsequent parsing and echo display.

[0064] Step 3, processing of the externally selected input text:

[0065] Step 3.1, pre-store a preset text mapping relation table; the preset text mapping relation table is used to store the mapping relation from each preset text text_old to the text text_new to be published;

[0066] Step 3.2, when the external selection input mode is activated, directly obtain the preset text text_old input externally; then, search the preset text mapping relation table to obtain the text text_new to be published corresponding to the preset text text_old;

[0067] Step 3.3, generate a preset text label text_tag uniquely corresponding to the preset text text_old, and then execute Step 3.4;

[0068] Wherein: in the preset text label text_tag, the mapping relation between the preset text text_old and the corresponding text text_new to be published is encapsulated;

[0069] Step 3.4, display the preset text text_old in the input box; obtain the current cursor position S1 of the cursor in the input box;

[0070] Step 3.5, obtain the cursor offset from the current cursor position S1 to the target position; wherein, the target position refers to the termination position of the preset text text_old;

[0071] Step 3.6, create a virtual cursor, move the virtual cursor from the current cursor position S1 to the target position according to the cursor offset, insert the corresponding preset text label text_tag at the position where the virtual cursor is located, and at the same time, set the label attribute of the preset text label text_tag as: the label is in a hidden state and invisible to the input box; the label is in a state of being out of the document flow and does not occupy page space;

[0072] Step 3.7, move the virtual cursor to the termination position of the preset text label text_tag inserted this time;

[0073] Step 3.8, directly replace the preset text text_old with the text text_new in the preset text label text_tag to generate the final rich text and save it.

[0074] In the present invention, both the text node label text_node_tag and the preset text label text_tag have special placeholders. Specifically, in actual operation, by adding an empty placeholder in the label as a special placeholder, it is possible to prevent the user from thinking that the cursor has disappeared.

[0075] In the present invention, the current cursor position S1 within the input box is obtained in the following manner:

[0076] Determine whether the input box is currently in a focused state. If it is in a focused state, directly locate the current cursor position S1 from the input box, and, when in the focused state, record the current cursor position S1 in real time;

[0077] If it is not in a focused state, i.e., in a defocused state, determine whether the input box has been clicked. If not, directly take the starting position of the input box as the current cursor position S1, that is: set getRangeAt(0) to zero; if it has been clicked, take the last recorded cursor position before the input box was defocused, which can be loaded through getSelection, as the current cursor position S1.

[0078] In the present invention, the main processing difference between free-form input text and externally selected input text lies in:

[0079] For free-form input text, it is necessary to use preset business syntax rules to match the node mapping relationship table in the free-form input text. Therefore, multiple nodes may be matched at different positions in the free-form input text. For each node, a text node label text_node_tag needs to be generated and inserted into the corresponding position. For externally selected input text, since this text is preset text, as a whole, through the preset text mapping relationship table, a corresponding text to be published is obtained. Therefore, only one preset text label text_tag is generated and inserted into the corresponding position.

[0080] The present invention can utilize APIs such as contentEditable and Select to customize personalized requirements, improve applicability, and be applicable to other rich text editing processes.

[0081] The present invention does not require the installation of other open-source libraries or plugins and can be used by combining the APIs of native h5, having good scalability and security.

[0082] The present invention incorporates the syntax rules into the text processing module, and users do not need to care about how to use or learn the syntax rules additionally, reducing the user's usage cost.

[0083] The present invention combines the advantages of markdown and rich text editing through the native contentEditable attribute, more flexibly adapts to the business, and relatively accurately realizes the rich text editing function of data saving and parsing display.

[0084] The above are only the preferred embodiments of the present invention. It should be noted that for those of ordinary skill in the art, without departing from the principle of the present invention, several improvements and refinements can be made, and these improvements and refinements should also be regarded as within the protection scope of the present invention.

Claims

1. A method for generating rich text, characterized in that, It includes the following steps: Step 1: Configure two text input methods for the input box, namely: free input method and external selection input method; Monitor the currently activated text input method of the input box. If it is monitored that the free input method is activated, then execute Step 2; If it is monitored that the external selection input method is activated, then execute Step 3; Step 2: Processing of free input text: Step 2.1: When the free input method is activated, read the cursor position at this time as the starting position of text free input; when the preset termination condition for text free input is met, read the cursor position at this time as the termination position of text free input; Read the text between the starting position and the termination position of text free input from the input box as the parent text; Step 2.2: Pre-store the node mapping relationship table; the node mapping relationship table is used to store the mapping relationship between the text nodes input by a specific user and the text nodes to be published; the text nodes input by a specific user are called the original text nodes text_node_old, and the text nodes to be published are called the new text nodes text_node_new; Use the preset business syntax rules to parse the parent text, and determine whether the original text node text_node_old in the node mapping relationship table can be matched in the parent text. If not, do not process the current parent text and return to Step 1; if so, then execute Step 2.3; Step 2.3: For each original text node text_node_old matched in the parent text, generate a uniquely corresponding text node label text_node_tag; Among them: in the text node label text_node_tag, encapsulate the mapping relationship between the original text node text_node_old and the corresponding new text node text_node_new; Step 2.4: Obtain the current cursor position S1 of the cursor in the input box; Step 2.5: Obtain the cursor offset from the current cursor position S1 of the cursor to the target position; where the target position is the termination position of any original text node text_node_old; Step 2.6: Create a virtual cursor, move the virtual cursor from the current cursor position S1 to the target position according to the cursor offset, insert the corresponding text node label text_node_tag into the position where the virtual cursor is located, and at the same time, set the label attribute of the text node label text_node_tag to: the label is in a hidden state and invisible to the input box; the label is in a state of being out of the document flow and does not occupy page space; Step 2.7: Move the virtual cursor to the termination position of the text node label text_node_tag inserted this time; Then, move the virtual cursor to the end position of the next original text node text_node_old, complete the insertion operation of the corresponding text node label text_node_tag, and until all the original text nodes text_node_old of the parent text are processed, execute step 2.8; Step 2.8, for the parent text where the corresponding text node labels text_node_tag are inserted at different positions, use the new text node text_node_new within the text node label text_node_tag to replace the corresponding original text node text_node_old, generate the final rich text, and save it; Step 3, processing of the externally selected input text: Step 3.1, pre-store a preset text mapping relationship table; the preset text mapping relationship table is used to store the mapping relationship from each preset text text_old to the text text_new to be published; Step 3.2, when the external selection input method is activated, directly obtain the preset text text_old of the external selection input; then, search the preset text mapping relationship table to obtain the text text_new corresponding to the preset text text_old; Step 3.3, generate a preset text label text_tag that is uniquely corresponding to the preset text text_old, and then execute step 3.4; Wherein: within the preset text label text_tag, encapsulate the mapping relationship between the preset text text_old and the corresponding text text_new to be published; Step 3.4, display the preset text text_old in the input box; obtain the current cursor position S1 of the cursor in the input box; Step 3.5, obtain the cursor offset from the current cursor position S1 to the target position; wherein, the target position refers to the end position of the preset text text_old; Step 3.6, create a virtual cursor, move the virtual cursor from the current cursor position S1 to the target position according to the cursor offset, insert the corresponding preset text label text_tag at the position where the virtual cursor is located, and at the same time, set the label attribute of the preset text label text_tag as: the label is in a hidden state and invisible to the input box; the label is in a state of being out of the document flow and does not occupy page space; Step 3.7, move the virtual cursor to the end position of the preset text label text_tag inserted this time; Step 3.8, directly use the text text_new to be published within the preset text label text_tag to replace the preset text text_old, generate the final rich text, and save it.

2. The method for generating rich text according to claim 1, wherein, The free input method refers to the keyboard input method.

3. The method for generating rich text according to claim 1, wherein, The external selection input method refers to: an input selection button is configured outside the input box, and the input selection button provides multiple preset texts. When any one of the preset texts is selected, it is directly filled into the input box.

4. The method for generating rich text according to claim 1, wherein Both the text node label text_node_tag and the preset text label text_tag have special placeholders.

5. The method for generating rich text according to claim 1, wherein The current cursor position S1 in the input box is obtained in the following way: Determine whether the input box is currently in the focused state. If it is in the focused state, directly locate the current cursor position S1 from the input box. Moreover, when in the focused state, the current cursor position S1 is recorded in real time; If it is not in the focused state, that is, in the unfocused state, determine whether the input box has been clicked. If not, directly use the starting position of the input box as the current cursor position S1; if so, use the last recorded cursor position before the input box lost focus as the current cursor position S1.

Images