How to use kindeditor rich text box

I used two textbox editors in total this week! My last document was about the editor wangeditor, now let's talk about the editor kindeditor!

First, go to its official website to download the script!

http://kindeditor.net/demo.php

The operation done is almost the same as that of the wangeditor editor. You need to add the following tag to the <body> of your HTML:

1   <textarea style="width: 98%;" rows="15" name="Conten" class="input-block-level" id="Contents"></textarea>

This just needs to add this code in <body>!

Next comes the script code!

 1  (function () {
 2         KindEditor.ready(function (K) {
 3             editor = K.create('textarea[id="Contents"]', {
 4                 resizeType: 0,
 5                 pasteType: 1,
 6                 filterMode: true,
 7                 newlineTag: 'br',
 8                 useContextmenu: false,
 9                 allowPreviewEmoticons: false,
10                 uploadJson: 'js/kindeditor/asp.net/upload_json.ashx',
11                 fileManagerJson: 'js/kindeditor/asp.net/file_manager_json.ashx',
12                 allowFileManager:true
13             });
14         });

In this way, its text box is displayed, and this paragraph not only has the display, but also the configuration required for image uploading!

As for getting the content in the text box, I have tried many methods on the Internet. The following is the correct one!

1 editor.sync();
2     var Contents = $("#Contents").val();

The next step is the code for uploading the image, this does not require you to change anything! Just in the script where you bring up the textbox editor. Configure the path and you're good to go!

The picture below is the location of the path in my project!

Then you don't need to do anything, he will upload the pictures to you to do it!

As long as you configure it there, there is generally no problem! If you are unlucky, like I have a problem. It has been bothering me for a day and finally solved it!

The problem is that sometimes the image can't be uploaded, and sometimes it can. What cannot be reported is that the path is wrong, or the 405 predicate is not allowed! After my unremitting efforts, this problem was finally solved!

The reason is that its default configuration image upload is in the form of PHP. And I'm using ASP.NET, the official document just says that you only need to configure the path to the corresponding path in the script I just wrote above when the text box is displayed!

This works, but sometimes it doesn't recognize what you configured in the script!

In this case, you need to change the source code of this stuff!

Find this path in the image below and find the script file of image.js! Make some changes in this one!

In this way, the problem of uploading pictures in this text box is solved, I hope it can help you!

 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325084837&siteId=291194637