UEditorPlus富文本编辑器示例代码-html代码-BFW代码库

UEditorPlus富文本编辑器示例代码

代码语言：html

所属分类：其他

代码描述：UEditorPlus富文本编辑器示例代码,上传等功能需要后端代码配置，还有关于问题也需要放在同一域名下。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html>
<head>
    <title>UEditor增强版演示</title>
    <meta name="viewport" content="width=device-width, minimum-scale=0.5, maximum-scale=5, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ueditor/ueditor.all.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ueditor/lang/zh-cn/zh-cn.js"></script>

    <script>
        // window.UEDITOR_CONFIG.toolbars[0].push('undo');
    </script>
   
    <style>
        :root {
            /*--ueditor-top-offset: 20px;*/
        }
    </style>

</head>
<body class="demo-editor-page">
<div>
    <h1>完整示例</h1>
    <div>
        <script id="editor" type="text/plain" style="height:300px;">
<h1>
    你好 UEditor
</h1>
<p>
    基于 UEditor 二次开发的富文本编辑器，让 UEditor <span style="color: #E36C09;">焕<span style="color: #0070C0;">然</span><span style="color: #31859B;"><span style="color: #00B050;">一</span><span style="color: #FF0000;">新</span></span></span>
</p>

<table data-sort="sortDisabled">
    <tbody>
        <tr class="firstRow">
            <td valign="top" style="word-break: break-all;" rowspan="1" colspan="3">
                我是表格
            </td>
        </tr>
        <tr>
            <td width="273" valign="top" style="word-break: break-all;">
                如果
            </td>
            <td width="273" valign="top" style="word-break: break-all;">
                有一天
            </td>
            <td width="273" valign="top" style="word-break: break-all;">
                我离开了
            </td>
        </tr>
        <tr>
            <td valign="top" colspan="1" rowspan="1" style="word-break: break-all;">
                怎么才能
            </td>
            <td valign="top" colspan="1" rowspan="1" style="word-break: break-all;">
                证明我
            </td>
            <td valign="top" colspan="1" rowspan="1" style="word-break: break-all;">
                曾经来过
            </td>
        </tr>
    </tbody>
</table>
<pre class="brush:html;toolbar:false">&lt;div&gt;
  &lt;span&gt;这里是HTML标签&lt;/span&gt;
&lt;/div&gt;</pre>
<h2>
公式支持
</h2>
<p>
    <img src="//repo.bfw.wiki/bfwrepo/image/5d6539613d08b.png"
      data-formula-image="%5Cint%20%5Cfrac%7B1%7D%7Bx%7D%20dx%20%3D%20%5Cln%20%5Cleft%7C%20x%20%5Cright%7C%20%2B%20C"/>
</p>
<p>
    <br/>
</p>

        </script>
    </div>
    <div id="btns" style="margin-top:20px;">
        <div>

            <button onclick="alert(UE.getEditor('editor').getAllHtml())">获得整个html的内容</button>
            <button onclick="alert(UE.getEditor('editor').getContent())">获得内容</button>
            <button onclick="UE.getEditor('editor').setContent('<p>欢迎.........完整代码请登录后点击上方下载按钮下载查看