HTML online editor does not need to know how to use Dreamweaver. If you know how to use Word, you can use this editor. It is very practical in article systems or news systems that require text editing in web programs. But how to embed the html editor into the web page and how to obtain the data inside? ! First we assume that the HTML online editor we want to call is placed in a separate page, and the file name is gledit.htm. There are two basic calling methods for the HTML online editor 1. Call using object: 1. How to embed the html editor in the web page: We add the following html code where it needs to be embedded: The data in the object tag followed by the data is the path to the online editor page we want to call, and the id is We call object to get the id, which will be used later when fetching the data in the editor. Width and height are the height and width of the editor. 2. How to get the data in the html editor: We put all the content that needs to be submitted in a form. The editor called by object is also placed in this form. At the same time, we can set a hidden text area ( or ) is used to temporarily save html online editing when submitting Because the content of the object in the form cannot be directly obtained in asp, jsp, or php, we must use the hidden text area to obtain the data. We copy the contents of the object to the hidden text area when the form is submitted. The detailed code is as follows:
< form method="post" action="add_news_save.asp" onsubmit="CheckForm()" name="form1">
This way In the background processed page, we can directly obtain the data of the html online editor by fetching the data of the hidden area content.
3. How to upload native images to the html online editor in the text editor: First, we make a window to upload images pop up when we click the button to insert images. We use the program we wrote to upload the native images. After the image is sent to the server, we need to record the path of the image, and then add the html tag that displays the image to the value of the html online editor. The detailed description and code are as follows: In the editor, we add the event onclick="window.open('img_upload.asp','img_upload','width=481 height=190')" on the button to insert the image> In 'img_upload.asp' we upload the submitted image to the server to create a directory and then record the image path
This allows you to simply insert the uploaded image into in the editor. 4. How to call the HTML online editor to modify the data when editing and modifying the article: When we submit the HTML online editor to modify the data when adding to the database, we also need to be able to use the HTML online editor to edit the content of the database. to modify the data. First we add a hidden area to the form to place the content in the database, for example , please note that we use hidden textarea here instead of hidden input, because the data may contain carriage returns and line feeds, so if we use "> It is possible that an HTML error occurs because there is a line break in <%=(rs("Content")%> (value= follows The received data must be on one line, otherwise an error will occur). Then use object to call the HTML online editor as described previously. The method and code are the same as above. Now what we have to do is actually the reverse process when submitting. We only need to change the hidden text Just copy the content of the area to the HTML online editor. Here we add
in the body, so that when the page is loaded When finished, you can put the content in the database into the HTML online editor for editing. The submission process is the same as described above, so I won’t go into details here.
2. Use iframe calls (some of them are repeated with object calls. Just describe it briefly) 1. How to embed in a web page: We add the following html code where it needs to be embedded: The data followed by "src=" is the online editor page we want to call The path and id are the id we get when calling IFRAME, and Width and height are the height and width of the editor. 2. How to get the data in the html editor: We also put all the content that needs to be submitted in a form. We can set a hidden text area ( or ) for Temporarily save the data of the html online editor when submitting, and we use the hidden text area to obtain the data. We copy the contents of the object to the hidden text area when the form is submitted. The detailed code is as follows: function subchk(cmd) { document.form1.content.value= window.content_html.getHTML(); }
In the page processed in the background We can directly obtain the data of the html online editor by fetching the data of the hidden area content. 2. How to get the data in the html editor: We put all the content that needs to be submitted in a form. The editor called by object is also placed in this form. At the same time, we can set a hidden text area ( or ) is used to temporarily save html online editing when submitting Because the content of the object in the form cannot be directly obtained in asp, jsp, or php, we must use the hidden text area to obtain the data. We copy the contents of the object to the hidden text area when the form is submitted. The detailed code is as follows:
< form method="post" action="add_news_save.asp" onsubmit="CheckForm()" name="form1">
This way In the background processed page, we can directly obtain the data of the html online editor by fetching the data of the hidden area content. 3. How to upload local images to the html online editor in the text editor: First, we make a window to upload images pop up when we click the button to insert images. We use a program we wrote to upload local images to On the server, we then need to record the path of the image, and then insert the html tag that displays the image at the cursor position by writing a function in the web page that calls the html online editor. The detailed description and code are as follows: In the editor, we add the event onclick="window.open('img_upload.asp','img_upload','width=481 height=190')" on the button to insert the image> In the page that calls the editor, we define the function to insert html code into the editor
This allows you to simply insert the uploaded image into the editor. 4. How to call the HTML online editor to modify the data when editing and modifying the article: When we add the HTML online editor to modify the data and submit it to the database, we also need to be able to edit the content of the database online with HTML. processor to modify the data. First we add a hidden area to the form to place the content in the database, for example , here we add
