美文网首页
富文本的使用

富文本的使用

作者: 怪蜀黎有糖糖 | 来源:发表于2018-12-04 20:01 被阅读0次
    富文本编辑器

    如何在自己的页面中导入富文本编辑器,今天学习到的干货,赶紧自己码起,以备以后需要时参考!

    用easyui这个前端框架来引入~

    首先,,,需要引入js和css

    <link href="kindeditor-4.1.10/themes/default/default.css" type="text/css" rel="stylesheet">

    <script type="text/javascript" charset="utf-8" src="kindeditor-4.1.10/kindeditor-all-min.js"></script>

    <script type="text/javascript" charset="utf-8" src="kindeditor-4.1.10/lang/zh_CN.js"></script>

    <script type="text/javascript" charset="utf-8" src="jquery-easyui-1.4.1/jquery.min.js"></script>

    具体路径根据自己项目中这些资源文件的位置而定

    生成富文本主要用到一段Js

    <script type="text/javascript">

       $(function(){

          KindEditor.ready(function(){

             KindEditor.create("#editor")

          })

       })

    </script>

    页面完成加载后,通过KindEditor.create("#editor")来创建富文本,create里面的内容为JQ的选择器

    上文的意思为在  id为editor的元素内创建一个富文本编辑器

    <body>

           <h1>富文本编辑器Demo</h1>

          <textarea style="width:700px;height:350px" id="editor"></textarea>

    </body>

    效果展示:

    0.0

    学习整理笔记之富文本的使用 

    完结!!!

    上面会用到的资源下载链接

    链接: https://pan.baidu.com/s/1qH96hDPLmgbBRp8SKStdiA 提取码: 4x95 

    相关文章

      网友评论

          本文标题:富文本的使用

          本文链接:https://www.haomeiwen.com/subject/dmcqfqtx.html