轻量级富文本编辑 Trumbowyg —— 基于 jQuery 插件配置
使用方法👇
首先,添加jQuery到页面<body>位置:
<script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>Trumbowyg需要jQuery > = 1.7,因为它使用.on()一个新的函数出现在1.7版本。
在这之后,你必须加载Trumbowyg。
<script src="js/vendor/trumbowyg.min.js"></script>别忘了Trumbowyg CSS到<head>,或负载编辑您自己的风格。
<link rel="stylesheet" href="css/vendor/trumbowyg.css">基础知识
这最少的代码将一个简单的div Trumbowyg到神奇的WYSIWYG编辑器。
$('#trumbowyg-demo').trumbowyg();如果你想设置Trumbowyg选项,添加一个包含你的选择对象作为参数。
$('#trumbowyg-demo').trumbowyg({ fullscreenable: false, closable: true, btns: ['bold', 'italic', '|', 'insertImage']
});Trumbowyg 1.17,颜色插件用法，
$('#my-editor').trumbowyg({//设置中文lang: 'zh_cn',// closable: true,fixedBtnPane: true,//设置颜色插件btnsAdd: ['foreColor','backColor'],btnsDef: {// 设置上传的3种方法，远程上传，本地上传，图片64位加密image: {dropdown: ['insertImage', 'upload','base64'],ico: 'insertImage'}},// Redefine the button panebtns: ['viewHTML','|', 'formatting','|', 'btnGrp-semantic','|', 'link','|', 'image','|', 'btnGrp-justify','|', 'btnGrp-lists','|', 'horizontalRule']，});颜色插件在 dist目录下的plugins目录下！
Button pane 按钮窗格
这可能是最有趣的选项，它允许您选择出现在按钮窗格中的按钮。此选项是一个数组，其中包含表示按钮或垂直分隔符（使用竖线字符）的字符串值。若要创建自己的自定义按钮窗格，请定义一个数组并将其传递给 btns 该选项。
$('.simple-editor').trumbowyg({btns: [['bold', 'italic'], ['link']] //加粗 斜体 链接
}); By default, btns option value is:
默认情况下， btns 选项值为：
$('.simple-editor').trumbowyg({btns: [['viewHTML'], //查看html['undo', 'redo'], // 撤消 重做 ['formatting'], //格式['strong', 'em', 'del'], //字体加粗['superscript', 'subscript'], //上标 下标 ['link'], //链接['insertImage'], // 插入图片['justifyLeft', 'justifyCenter', 'justifyRight', 'justifyFull'], //靠左 剧中 靠右 全部['unorderedList', 'orderedList'], //无序列表 有序列表['horizontalRule'], //水平规则['removeformat'], //删除格式['fullscreen']， //全屏]
});参考链接 Documentation | Trumbowyg 官网
相关文章：
轻量级富文本编辑 Trumbowyg —— 基于 jQuery 插件配置
使用方法👇 首先,添加jQuery到页面<body>位置: <script src"http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script> <script>window.jQuery || document.write(<script src"js/vendor/jquery-1.10.2.min.js&qu…...
那些王道书里的题目-----计算机网络篇
注：仅记录个人认为有启发的题目 p155 34.下列四个地址块中，与地址块 172.16.166.192/26 不重叠，且与172.16.166.192/26聚合后的地址块不会引入多余地址的是（） A.172.16.166.192/27 B.172.16.166.128/26 …...
【前端学习——js篇】 10.this指向
具体见：https://github.com/febobo/web-interview 10.this指向 根据不同的使用场合，this有不同的值，主要分为下面几种情况： 默认绑定隐式绑定new绑定显示绑定 ①默认绑定 全局环境中定义person函数，内部使用this关…...
项目搭建之统一返回值
自定义枚举类 Getter public enum ReturnCodeEnum {/*** 操作失败**/RC999("999","操作XXX失败"),/*** 操作成功**/RC200("200","success"),/*** 服务降级**/RC201("201","服务开启降级保护,请稍后再试!"),/*** …...
嵌入式和 Java 走哪条路?
最近看到一个物联网大三学生的疑问，原话如下： 本人普通本科物联网工程专业，开学大三，现在就很迷茫，不打算考研了，准备直接就业，平时一直在实验室参加飞思卡尔智能车比赛，本来是想走嵌…...
C++ 控制语句（一）
一 顺序结构 程序的基本结构有三种： 顺序结构、分支结构、循环结构 大量的实际问题需要通过各种控制流程来解决。 1.1 顺序结构 1.2 简单语句和复合语句 二 循环 2.1 for循环 语句流程图 注意：使用for语句的灵活性 三 while语句 四 do while语句...
mysql 用户管理-权限表
学习了《mysql5.7安装》，就先再了解下用户管理，先了解下权限表。 MySQL是一个多用户数据库，具有功能强大的访问控制系统，可以为不同用户指定允许 的权限。MySQL用户可以分为普通用户和root用户。root 用户是超级管理员,拥有所有权…...
【Postman如何进行接口测试简单详细操作实例】
1、下载Postman postman下载地址：Download Postman | Get Started for Free 2、安装Postman (1)双击下载好的postman-setup.exe文件，进行安装postman工具 (2)安装完成后，在桌面找到并打开postman软件，输入邮箱和密码进行登录&a…...
docker搭建Project Calico环境
Project Calico 是一个开源的网络和网络安全解决方案，专为容器、虚拟机和本地工作负载设计。它提供了高度可扩展的网络层，支持广泛的容器编排平台，如 Kubernetes、Docker Swarm和OpenStack。Calico 的主要特点包括： 支持多层网络策略，包括基于角色的访问控制(RBAC)。提供网…...
pyecharts操作一
pyecharts 是一个用于生成Echarts图表的Python库。Echarts是百度开源的一个数据可视化JS库，可以生成一些非常酷炫的图表。 环境安装 pip install pyecharts 检查版本 import pyecharts print(pyecharts.version) 2.0.3 柱状图绘制 from pyecharts.charts impor…...
『Apisix进阶篇』动态负载均衡：APISIX的实战演练与策略应用
🚀『Apisix系列文章』探索新一代微服务体系下的API管理新范式与最佳实践 【点击此跳转】 📣读完这篇文章里你能收获到 🎯 掌握APISIX中多种负载均衡策略的原理及其适用场景。📈 学习如何通过APISIX的Admin API和Dashboard进行负…...
【开发篇】十一、GC调优的分析工具
文章目录 1、调优的主要指标2、工具一：jstat3、工具二：Visual VM的插件4、工具三：Prometheus Grafana5、生成GC日志6、工具四：GC Viewer7、工具五：GCeasy GC调优，是为了避免因垃圾回收引起程序性能下降&am…...
SpringCloudConfig 使用git搭建配置中心
一 SpringCloudConfig 配置搭建步骤 1.引入 依赖pom文件 引入 spring-cloud-config-server 是因为已经配置了注册中心 <dependencies><dependency><groupId>org.springframework.cloud</groupId><artifactId>spring-cloud-config-server</…...
c#基础-引用类型和值类型的区别
在C#中，数据类型分为两类：值类型和引用类型。 值类型：直接存储数据，分配在栈(Stack)上。常见的值类型包括基本数据类型（int, float, double等），结构体（struct），枚举（enum）等。 引用类型：存储数据的引用和对象，分配在托管堆(Heap)上。常见的引用类型包括类（cla…...
面试题-3.20
1、__FILE__表示什么意思？ __FILE__：当前文件的完整路径和文件名 __LINE__：当前行 __DIR__：当前文件所在的目录 2、如何获取客户端的IP地址？ 通过超全局数组$_SERVER：echo $_SERVER[REMOTE_PORT]; 3、写…...
glibc内存管理ptmalloc - 多线程内存管理
上图 此图着重描述的是子线程，一个heap（由heap_info结构体描述）用完，需要另一个的情况。 子线程内存特点 1. 第一个heap物理内存上从低地址到高地址依次是：heap_infomalloc_state(arena)chunks /* arena.c #0 new_…...
区块链食品溯源案例实现（一）
引言： 食品安全问题一直是社会关注的热点，而食品溯源作为解决食品安全问题的重要手段，其重要性不言而喻。传统的食品溯源系统往往存在数据易被篡改、信息不透明等问题，而区块链技术的引入，为食品溯源带来了革命性的变革…...
4S店车辆管理系统的设计与实现|Springboot+ Mysql+Java+ B/S结构(可运行源码+数据库+设计文档)
本项目包含可运行源码数据库LW，文末可获取本项目的所有资料。 推荐阅读100套最新项目持续更新中..... 2024年计算机毕业论文（设计）学生选题参考合集推荐收藏（包含Springboot、jsp、ssmvue等技术项目合集） 目录 1. 管…...
SpringBoot+Prometheus+Grafana实现应用监控和报警
一、背景 SpringBoot的应用监控方案比较多，SpringBootPrometheusGrafana是目前比较常用的方案之一。它们三者之间的关系大概如下图： 关系图 二、开发SpringBoot应用 首先，创建一个SpringBoot项目，pom文件如下： <…...
10 - Debian如何让特定用户切换root身份
作者：网络傅老师 特别提示：未经作者允许，不得转载任何内容。违者必究！ Debian如何让特定用户切换root身份 《傅老师Debian小知识库系列之10》——原创 前言 傅老师Debian小知识库特点： 1、最小化拆解Debian实用技能…...
LLM处理半结构化数据，csv数据 :在序列化层对字段按熵分层路由——把每个低熵层一次性全局总结、把高熵 TEXT 用“质心+样例“做率最优覆盖、把寻址 α 显式落进 prompt
怎么给LLM 总结结论进行溯源 先搞清「寻址函数 α」是什么 L3 / L4 已经把 12 万条文本压成 8 类模式 + 几条原话证据。可这时候 LLM 看到的只是抽象论断： 「机型 X1C 的喷头堵塞，主要原因是耗材含水（占该类 18%）」 分析师马上会追问：“这 18% 具体是哪 5,200 条工单？给…...
吃透Agent Runtime九大核心设计，从基础跑通到工业级稳定落地
在当下人工智能飞速发展的时代，智能Agent已经成为大模型落地应用最主流的形态之一。从日常智能问答，自动化办公脚本，到复杂的项目工程自主开发，业务流程自主运维，各行各业都在尝试借助Agent解放人力成本，提…...
3C产品功能太多15秒讲不完？用爆款复刻Agent做2分钟完整演示，用户看完直接下单
3C数码产品做千川素材，最容易遇到一个问题：功能很多，15秒根本讲不清。蓝牙耳机要讲降噪、音质、续航、佩戴舒适度；智能手表要讲运动监测、健康功能、续航、防水和系统兼容；小家电要讲使用场景、操作步骤、参数差异和售…...
12个优质播客音乐素材网站，解决你缺BGM的烦恼
根据《2026年中国音频内容创作行业发展白皮书》数据显示，国内活跃播客创作者数量同比增长47%，超过62%的创作者表示，找到合适又合规的播客背景音乐是日常创作的核心痛点之一。很多新人创作者要么找不到风格匹配的素材，要么担心版权…...
大家都在签电子合同了，对企业有什么好处？
一、电子合同，已经不是什么新鲜事了可能你身边还有人在犹豫电子合同靠不靠谱，但数据不会骗人。据统计，2025年我国电子合同签约量达到2576.1亿份，市场规模已经达到305.1亿元，这几年年均增速超过23%。说白了，…...
Unity中用Sentis部署YOLOv8 Nano实现移动端实时目标检测
1. 为什么是YOLOv8 Nano Sentis？不是ONNX Runtime，也不是TensorRT？去年在做一个AR巡检项目时，我卡在物体检测环节整整三周。客户要求在中端安卓手机（骁龙665）上实现每秒15帧以上的实时检测，同时…...
从零开始学AI Agent：软件工程视角下的企业数字化转型实践指南（收藏版）
本文从软件工程视角出发，探讨了AI Agent在企业数字化转型中的应用与构建。首先强调需求分析的重要性，指出应从业务问题出发判断Agent是否适用。接着，介绍了Agent的系统设计，包括任务编排、上下文管理、记忆存储和工具扩展四个核心…...
1987年6月27日下午13-15点出生性格、运势和命运
1987年6月17日，下午15点到17点之间，正值盛夏时节，阳光炽烈而漫长。这一天出生的孩子，是中国改革开放后“黄金十年”中诞生的又一批弄潮儿。他们的成长轨迹，与全球化浪潮的涌入、市场经济的深化以及互联网的萌芽几乎同步…...
从文件上传到 RAG 检索：真正看懂了一个 AI 项目的知识库链路
一、前言：今天不是单独学一个知识点，而是串起了一条完整链路 今天继续分析 AI 项目中的 RAG 模块时，我发现自己之前对“文件上传”“文件切片”“向量化”“召回”“大模型回答”这些概念，虽然都单独听过，但真正放到项…...
Miro致力弥合AI潜力与组织现实之间的鸿沟
Miro在Canvas 26上将其AI平台建设成为现代AI生态系统的连接层 — 汇聚团队、智能体以及已经使用的工具，将个体AI生产率变为整个组织的转型 Miro是一个面向团队的人工智能（AI）创新工作空间。该公司宣布推出多项AI平台创新，强化了其…...