UEditor 实现新增“转换简体”和“转换繁体字”按钮功能

最新推荐文章于 2025-03-10 22:00:24 发布

天路客1234

最新推荐文章于 2025-03-10 22:00:24 发布

阅读量1.2w

点赞数

分类专栏： web js/jquery 文章标签： ueditor js

本文链接：https://blog.youkuaiyun.com/tianluke1234/article/details/76422904

版权

本文介绍了如何在UEditor中实现‘转换简体’和‘转换繁体字’的功能，包括修改配置文件window.UEDITOR_CONFIG.toolbars_BasicPage，添加按钮提示文字以及在ueditor.css中设置相应样式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、找到页面引用UEditor的几个配置文件。

1.引用文件

<script type="text/javascript" src="${
   ctx}/static/vendor/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="${
   ctx}/static/vendor/ueditor/ueditor.all.js"></script>
<script type="text/javascript" src="${
   ctx}/static/vendor/ueditor/lang/zh-cn/zh-cn.js"></script>

2.配置文件：其中这里通过后台配置：toolbars: window.UEDITOR_CONFIG.toolbars_BasicPage

<script type="text/javascript">
$(function() {
 var edHeight=$(document).height()-150;
    var editor_clobs_text = UE.getEditor('clobs_text',{
   <c:if test="${
   !empty field.customs['toolbar']}">toolbars: window.UEDITOR_CONFIG.toolbars_${
   field.customs['toolbar']}Page,</c:if>
   initialFrameWidth:null,
   initialFrameHeight:edHeight,
   elementPathEnabled:false,
   enableContextMenu: false,
       imageUrl:"${
   ctx}${
   cmscp}/core/upload_image.do?ueditor=true",
       wordImageUrl:"${
   ctx}${
   cmscp}/core/upload_image.do?ueditor=true",
       fileUrl:"${
   ctx}${
   cmscp}/core/upload_file.do?ueditor=true",
       videoUrl:"${
   ctx}${
   cmscp}/core/upload_video.do?ueditor=true",
       catcherUrl:"${
   ctx}${
   cmscp}/core/get_remote_image.do?ueditor=true",
       imageManagerUrl:"${
   ctx}${
   cmscp}/core/image_manager.do",
       getMovieUrl:"${
   ctx}${
   cmscp}/core/get_movie.do",
       localDomain:['${
   !empty GLOBAL.uploadsDomain ? GLOBAL.uploadsDomain : ""}']
  });
});
</script>

二、根据配置文件window.UEDITOR_CONFIG.toolbars_BasicPage 到 ueditor.config.js 找到配置toolbars_BasicPage，增加两个按钮,'simple','tradition'。（备注：如果在页面引用ueditor没有配置toolbars，默认就在 ueditor.config.js 里的toolbars里增加,<

最低0.47元/天解锁文章