KindEditor is an open source HTML visual editor, mainly used to allow users to obtain WYSIWYG editing effects on websites. It is compatible with mainstream browsers such as IE, Firefox, Chrome, Safari, and Opera. KindEditor is written in JavaScript and can be seamlessly integrated with Java, .NET, PHP, ASP and other programs. This is the introduction on the official website.
Homepage: http://www.kindsoft.net/index.php
Download: http://www.kindsoft.net/down.php
Example: http://www.kindsoft.net/demo.php
The problem encountered when using the kindeditor text editor is that the customer directly pastes the text content from Excel into the text editor (can you be more lazy), and then saves it directly without adjusting the pasted content (do you dare to do that? Be lazy)! Regarding this speechless behavior, I could only yell at him, let me make a label filter so that you won't have any problems when pasting it (coward? Who can afford to offend customers).
The filtering method is also simple:
KindEditor.ready(function (K) { editor = K.create('textarea[name="content"]', { filterMode: true,//是否开启过滤模式 }); });
The default filterMode is off. First set filterMode to true, then add htmlTags to specify the HTML tags and attributes to be retained. The key of the hash array is the HTML tag name, the value is the HTML attribute array, and the attributes starting with "." represent the style attribute. Data type: Object
KindEditor.ready(function (K) { editor = K.create('textarea[name="content"]', { filterMode: true,//是否开启过滤模式 htmlTags : { font : ['id', 'class', 'color', 'size', 'face', '.background-color'], div : [ 'id', 'class', 'align', '.border', '.margin', '.padding', '.text-align', '.color', '.background-color', '.font-size', '.font-family', '.font-weight', '.background', '.font-style', '.text-decoration', '.vertical-align', '.margin-left' ], a : ['id', 'class', 'href', 'target', 'name'], embed : ['id', 'class', 'src', 'width', 'height', 'type', 'loop', 'autostart', 'quality', '.width', '.height', 'align', 'allowscriptaccess'], img : ['id', 'class', 'src', 'width', 'height', 'border', 'alt', 'title', 'align', '.width', '.height', '.border'], 'p,ol,ul,li,blockquote,h1,h2,h3,h4,h5,h6' : [ 'id', 'class', 'align', '.text-align', '.color', '.background-color', '.font-size', '.font-family', '.background', '.font-weight', '.font-style', '.text-decoration', '.vertical-align', '.text-indent', '.margin-left' ], pre : ['id', 'class'], hr : ['id', 'class', '.page-break-after'], 'br,tbody,tr,strong,b,sub,sup,em,i,u,strike,s,del' : ['id', 'class'], iframe : ['id', 'class', 'src', 'frameborder', 'width', 'height', '.width', '.height'] } }); });
The above is how the editor introduces to you how to filter HTML in the Kindeditor online text editor. I hope it will be helpful to you!