OurJS


OurJS-我们的JS, 我们的技术-IT文摘; 专注JS相关领域;
我们热爱编程, 我们热爱技术;我们是高大上, 有品味的码农;

欢迎您订阅我们的技术周刊


我们会向您分享我们精心收集整理的,最新的行业资讯,技术动态,外文翻译,热点文章;
我们使用第三方邮件列表向您推送,我们不保存您的任何个人资料,注重您的隐私,您可以随时退订,

欢迎分享您的观点,经验,技巧,心得

让我们一起找寻程序员的快乐,探索技术, 发现IT人生的乐趣;


本网站使用缓存技术每次加载仅需很小流量, 可在手机中流畅浏览;
如果您发现任何BUG,请即时告知我们: ourjs(at)ourjs.com

配置TinyMCE网页文本编辑器不显示html head body等标签信息


分享到


分类 JS学习   关键字 前端   发布 ourjs  1553172699955
注意 转载须保留原文链接,译文链接,作者译者等信息。  
TinyMCE是一个非常优秀的HTML网页文本编辑器,可以完美地跟input结合。 项目主页: https://www.tiny.cloud/


使用非常简单

<textarea data-editor name="text" class="form-control" rows="6"></textarea>
<script src="/js/tinymce/tinymce.min.js"></script>


tinymce.init({
    selector            : '[data-editor]'
  , content_css         : $dataEditor.attr('data-editor') || ''
  , language            : (FE_LOCAL.language || '').replace('-', '_')
  , menubar             : 'edit insert format table'
  , relative_urls       : false
  , remove_script_host  : false
  , convert_urls        : true
  , plugins             : [
        "advlist autolink lists link image charmap print preview anchor"
      , "searchreplace visualblocks code fullscreen fullpage"
      , "insertdatetime media table paste textcolor colorpicker contextmenu"
    ]
  , image_dimensions    : false
  , toolbar: "insertfile undo redo | styleselect | bold italic underline strikethrough | fontselect fontsizeselect | "
      + "forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | "
      + "link image code print"
  , setup: function(editor) {
      editor.on('init', function(e) {

      })

      editor.on('change', function(e) {
          editor.save()
      })

      editor.on('keyup', function(e) {
          editor.save()
      })
    }
})

其中监听editor的事件可以让文本有改动时,立即存储到对应的form表单元素中

不过默认配置获取的结果是带HTML/head/body等标签的,如果只想要你编辑部分的HTML代码可将 fullpage 插件去掉即可。
即: 

  , plugins             : [
        "advlist autolink lists link image charmap print preview anchor"
      , "searchreplace visualblocks code fullscreen"
      , "insertdatetime media table paste textcolor colorpicker contextmenu"
    ]

社区评论 ( Beta版 )
OnceDoc 您自己的企业内容管理系统——文档、流程、知识库、报表、网盘All In One

访问404页面,寻找丢失儿童
 相关阅读 - JS学习
  1. node.js中将console.log日志内容输出到文件
  2. typeof判断参数是否为undefined与全等判断法性能比较
  3. JavaScript不刷新查找当前网址上的querystring并修改查询字符串变量
  4. JavaScript如何快速高性能清空删除Array数组中的所有元素,并保持引用
  5. JavaScript使用类似break机制中断forEach循环
  6. 用jQuery将JavaScript对象转换为querystring查询字符串
  7. bootstrap-datetimepicker时间日期范围选取组件使用说明及简单教程
  8. 用JavaScript实现basename获取路径中的文件名
  9. 用JavaScript测试图像上两点之间的距离
  10. JavaScript运算出现很多小数导致运算不精确的问题,用toFixed解决

 关键字 - 前端
  1. 专为控制打印设计的CSS样式
  2. css去掉table的td单元格的间距cellspacing,设置隔行显示不同背景颜色
  3. 5个经典的前端面试问题
  4. 用网页table thead tfoot元素完美控制页眉页脚显示内容打印的简单方式
  5. jQuery用outterHtml获取相对innerHTML父一级包含其自身的html代码内容
  6. 15个最好的HTML5前端响应式框架(2014)
  7. 用纯CSS改变html radio/checkbox默认背景颜色样式
  8. 配置TinyMCE网页文本编辑器不显示html head body等标签信息
  9. AngularJS在大型单页面应用中的性能优化(一)
  10. 超简易——Bootstrap可关闭tab标签页

 欢迎订阅 - 技术周刊

我们热爱编程, 我们热爱技术; 我们是高端, 大气, 上档次, 有品味, 时刻需要和国际接轨的码农; 欢迎您订阅我们的技术周刊; 您只需要在右上角输入您的邮箱即可; 我们注重您的隐私,您可以随时退订.
加入我们吧! 让我们一起找寻码农的快乐,探索技术, 发现IT人生的乐趣;


 关注我们

我们的微信公众号: ourjs-com
打开微信扫一扫即可关注我们:
IT文摘-程序员(码农)技术周刊

ourjs官方微信号