博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
layui富文本编辑器的使用
阅读量:2066 次
发布时间:2019-04-29

本文共 1214 字,大约阅读时间需要 4 分钟。

<link href="/layui/css/layui.css" rel="stylesheet">

<div class="form-group" style="margin-bottom:5px;">

    <label for="description">图片</label>
    <textarea name="description" class="form-control" placeholder="图片" rows="5" id="description" style="display: none;">{if !empty($artInfo['description'])}{$artInfo['description']}{/if}</textarea>
</div>

<div class="form-group" style="margin-bottom:5px;">

    <label for="options">选项</label>
    <textarea name="options" class="form-control" placeholder="选项" rows="5" id="options" style="display: none;">
    {if !empty($artInfo['options'])}{$artInfo['options']}{/if}
    </textarea>
</div>

<script src="/layui/layui.js"></script>
<script>
    layui.use('layedit', function(){
        var layedit1 = layui.layedit;

        //注意:layedit.set 一定要放在 build 前面,否则配置全局接口将无效。

        layedit1.set({
            uploadImage: {
                url: '/cdaadmin/ability/upimg', //接口url
                type: 'post' //默认post
            }
        });

        layedit1.build('description', {//建立编辑器

            height: 180,
        });
    });

    layui.use('layedit', function(){

        var layedit2 = layui.layedit;

        layedit2.build('options', {//建立编辑器

            height: 180,
            tool: [
                'strong' //加粗
                ,'italic' //斜体
                ,'underline' //下划线
                ,'del' //删除线
                ,'|' //分割线
                ,'left' //左对齐
                ,'center' //居中对齐
                ,'right' //右对齐
                ,'link' //超链接
                ,'unlink' //清除链接
            ]
        });
    });
</script>

转载地址:http://nykmf.baihongyu.com/

你可能感兴趣的文章
Eclipse使用(十)—— 使用Eclipse创建简单的Maven Java项目
查看>>
Eclipse使用(十一)—— 使用Eclipse创建简单的Maven JavaWeb项目
查看>>
Intellij IDEA使用(十三)—— 在Intellij IDEA中配置Maven
查看>>
面试题 —— 关于main方法的十个面试题
查看>>
集成测试(一)—— 使用PHP页面请求Spring项目的Java接口数据
查看>>
使用Maven构建的简单的单模块SSM项目
查看>>
Intellij IDEA使用(十四)—— 在IDEA中创建包(package)的问题
查看>>
Redis学习笔记(四)—— redis的常用命令和五大数据类型的简单使用
查看>>
云原生周报第 2 期 | 2019-07-01~2019-07-05
查看>>
kubectl 创建 Pod 背后到底发生了什么?
查看>>
Kube-scheduler 源码分析(二):调度程序启动前逻辑
查看>>
kubernetes 1.15 有哪些让人眼前一亮的新特性?
查看>>
云原生周报:第 3 期
查看>>
深入理解 Linux Cgroup 系列(三):内存
查看>>
7月最新Java微服务资料
查看>>
Linux 指令
查看>>
wi10优化
查看>>
windows console 颜色设置
查看>>
VC unicode下Cstring转char*
查看>>
MFC ListBox使用
查看>>