wordpress CMS主题 微信
Home > PHP开发 > 百度ueditor编辑器在html编辑模式代码会混乱

百度ueditor编辑器在html编辑模式代码会混乱

高时银博客 PHP开发 点击: 99 次 0 1
  • 标签: |
  • 前面的文章我们介绍了thinkphp整合ueditor百度编辑器——thinkphp3.2.3如何集成ueditor百度编辑器? 百度安装和使用还是比较方便实用的。但是,最近碰到一个奇怪的问题:在使用ueditor编辑的html按钮进行html代码编辑模式时,代码出现不正常,非常乱,无从下手进行编辑,如下图:

    百度ueditor编辑器在html编辑模式代码会混乱

    本想百度一下这种情况有没有碰到,可百度了一圈,没有相似的问题存在,这可能是我这边使用编辑器时出现什么bug造成的原因,只好自己慢慢找问题。最有效的方式就是通过审查工具来查看问题。

    打开页面的审查工具,最终发现一个现象,ueditor对输入框中的html标签进行重新编辑,在<p>标签外层包裹了<pre><span>2个标签,如下图:

    百度ueditor编辑器在html编辑模式代码会混乱

    而我对当前页面中的span标签做了css样式添加(如上图),这样就对ueditor编辑器中的span标签产生了影响,因为ueditor编辑器是放在 .main li标签里的。于是,在CSS样式中重新定义这个ueditor编辑器中的span样式,问题解决了,效果如下图:

    百度ueditor编辑器在html编辑模式代码会混乱

    还以为是ueditor编辑器的问题呢,原来是我模板中的CSS样式与ueditor编辑器中的样式发生冲突。

     


    文章作者:高时银博客
    本文地址:http://wanlimm.com/77201805295614.html
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    目前还没有评论。赶快来坐沙发吧。

    发表评论