kindeditor修复会替换script内容的问题

 更新时间:2015年04月03日 10:04:24   投稿:hebedich  
这里给大家分享的是个人修改的kindeditor的代码,主要是修复了一些BUG,添加了些常用功能,推荐给大家,有需要的小伙伴可以参考下。

kindeditor一些个人修改

1.替换script里面的内容的问题
2.颜色选择器扩展,复制的fck编辑器选颜色
3.swfupload.swf上传前图片预览功能

kindeditor.js

function _formatHtml(html, htmlTags, urlType, wellFormatted, indentChar) {
    if (html == null) {
      html = '';
    }
    //2015-03-25
    html = html.replace(/textarea__/ig, "textarea");
    urlType = urlType || '';
    wellFormatted = _undef(wellFormatted, false);
    indentChar = _undef(indentChar, '\t');
    var fontSizeList = 'xx-small,x-small,small,medium,large,x-large,xx-large'.split(',');
 
    //2015-04-02将script里面的数据读取处理
    var obj = {};
    var index = 0;
    html = html.replace(/(<script\s[^>]*>)([\s\S]*?)(<\/script>)/ig, function ($0, $1, $2, $3) {
      var value = $2 + '';
      if (value) {
        var key = "{$script__" + index + "$}";
        obj[key] = value;
        index++;
        return $1 + key + $3;
      } else {
        return $0;
      }
    });
    html = html.replace(/(<(?:pre|pre\s[^>]*)>)([\s\S]*?)(<\/pre>)/ig, function ($0, $1, $2, $3) {
      return $1 + $2.replace(/<(?:br|br\s[^>]*)>/ig, '\n') + $3;
    });
    html = html.replace(/<(?:br|br\s[^>]*)\s*\/?>\s*<\/p>/ig, '</p>');
    html = html.replace(/(<(?:p|p\s[^>]*)>)\s*(<\/p>)/ig, '$1<br />$2');
    html = html.replace(/\u200B/g, '');
    html = html.replace(/\u00A9/g, '&copy;');
    html = html.replace(/\u00AE/g, '&reg;');
    html = html.replace(/<[^>]+/g, function ($0) {
      return $0.replace(/\s+/g, ' ');
    });
    var htmlTagMap = {};
    if (htmlTags) {
      _each(htmlTags, function (key, val) {
        var arr = key.split(',');
        for (var i = 0, len = arr.length; i < len; i++) {
          htmlTagMap[arr[i]] = _toMap(val);
        }
      });
      if (!htmlTagMap.script) {
        html = html.replace(/(<(?:script|script\s[^>]*)>)([\s\S]*?)(<\/script>)/ig, '');
      }
      if (!htmlTagMap.style) {
        html = html.replace(/(<(?:style|style\s[^>]*)>)([\s\S]*?)(<\/style>)/ig, '');
      }
    }
    var re = /(\s*)<(\/)?([\w\-:]+)((?:\s+|(?:\s+[\w\-:]+)|(?:\s+[\w\-:]+=[^\s"'<>]+)|(?:\s+[\w\-:"]+="[^"]*")|(?:\s+[\w\-:"]+='[^']*'))*)(\/)?>(\s*)/g;
    var tagStack = [];
    html = html.replace(re, function ($0, $1, $2, $3, $4, $5, $6) {
      var full = $0,
      startNewline = $1 || '',
      startSlash = $2 || '',
      tagName = $3.toLowerCase(),
      attr = $4 || '',
      endSlash = $5 ? ' ' + $5 : '',
      endNewline = $6 || '';
      if (htmlTags && !htmlTagMap[tagName]) {
        return '';
      }
      if (endSlash === '' && _SINGLE_TAG_MAP[tagName]) {
        endSlash = ' /';
      }
      if (_INLINE_TAG_MAP[tagName]) {
        if (startNewline) {
          startNewline = ' ';
        }
        if (endNewline) {
          endNewline = ' ';
        }
      }
      if (_PRE_TAG_MAP[tagName]) {
        if (startSlash) {
          endNewline = '\n';
        } else {
          startNewline = '\n';
        }
      }
      if (wellFormatted && tagName == 'br') {
        endNewline = '\n';
      }
      if (_BLOCK_TAG_MAP[tagName] && !_PRE_TAG_MAP[tagName]) {
        if (wellFormatted) {
          if (startSlash && tagStack.length > 0 && tagStack[tagStack.length - 1] === tagName) {
            tagStack.pop();
          } else {
            tagStack.push(tagName);
          }
          startNewline = '\n';
          endNewline = '\n';
          for (var i = 0, len = startSlash ? tagStack.length : tagStack.length - 1; i < len; i++) {
            startNewline += indentChar;
            if (!startSlash) {
              endNewline += indentChar;
            }
          }
          if (endSlash) {
            tagStack.pop();
          } else if (!startSlash) {
            endNewline += indentChar;
          }
        } else {
          startNewline = endNewline = '';
        }
      }
      if (attr !== '') {
        var attrMap = _getAttrList(full);
        if (tagName === 'font') {
          var fontStyleMap = {}, fontStyle = '';
          _each(attrMap, function (key, val) {
            if (key === 'color') {
              fontStyleMap.color = val;
              delete attrMap[key];
            }
            if (key === 'size') {
              fontStyleMap['font-size'] = fontSizeList[parseInt(val, 10) - 1] || '';
              delete attrMap[key];
            }
            if (key === 'face') {
              fontStyleMap['font-family'] = val;
              delete attrMap[key];
            }
            if (key === 'style') {
              fontStyle = val;
            }
          });
          if (fontStyle && !/;$/.test(fontStyle)) {
            fontStyle += ';';
          }
          _each(fontStyleMap, function (key, val) {
            if (val === '') {
              return;
            }
            if (/\s/.test(val)) {
              val = "'" + val + "'";
            }
            fontStyle += key + ':' + val + ';';
          });
          attrMap.style = fontStyle;
        }
        _each(attrMap, function (key, val) {
          if (_FILL_ATTR_MAP[key]) {
            attrMap[key] = key;
          }
          if (_inArray(key, ['src', 'href']) >= 0) {
            attrMap[key] = _formatUrl(val, urlType);
          }
          if (htmlTags && key !== 'style' && !htmlTagMap[tagName]['*'] && !htmlTagMap[tagName][key] ||
          tagName === 'body' && key === 'contenteditable' ||
          /^kindeditor_\d+$/.test(key)) {
            delete attrMap[key];
          }
          if (key === 'style' && val !== '') {
            var styleMap = _getCssList(val);
            _each(styleMap, function (k, v) {
              if (htmlTags && !htmlTagMap[tagName].style && !htmlTagMap[tagName]['.' + k]) {
                delete styleMap[k];
              }
            });
            var style = '';
            _each(styleMap, function (k, v) {
              style += k + ':' + v + ';';
            });
            attrMap.style = style;
          }
        });
        attr = '';
        _each(attrMap, function (key, val) {
          if (key === 'style' && val === '') {
            return;
          }
          val = val.replace(/"/g, '&quot;');
          attr += ' ' + key + '="' + val + '"';
        });
      }
      if (tagName === 'font') {
        tagName = 'span';
      }
      return startNewline + '<' + startSlash + tagName + attr + endSlash + '>' + endNewline;
    });
    html = html.replace(/(<(?:pre|pre\s[^>]*)>)([\s\S]*?)(<\/pre>)/ig, function ($0, $1, $2, $3) {
      return $1 + $2.replace(/\n/g, '<span id="__kindeditor_pre_newline__">\n') + $3;
    });
    html = html.replace(/\n\s*\n/g, '\n');
    html = html.replace(/<span id="__kindeditor_pre_newline__">\n/g, '\n');
    for (var key in obj) {
      html = html.replace(key, obj[key]);
    }
    //alert(html);
    return _trim(html);
  }

以上所述就是修改的kindeditor的全部代码了,希望大家能够喜欢。

相关文章

  • JS异步的执行顺序分析

    JS异步的执行顺序分析

    这篇文章介绍了JS异步的执行顺序,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-06-06
  • JavaScript简单下拉菜单特效

    JavaScript简单下拉菜单特效

    这篇文章主要为大家详细介绍了JavaScript简单下拉菜单特效,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-09-09
  • js 获取浏览器版本以此来调整CSS的样式

    js 获取浏览器版本以此来调整CSS的样式

    判断当前使用的是那个浏览器及浏览器的那个版本,根据浏览器版本来调整CSS的样式,下面是获取当前浏览器的代码,需要的朋友可以参考下
    2014-06-06
  • 解决layui数据表格table的横向滚动条显示问题

    解决layui数据表格table的横向滚动条显示问题

    今天小编就为大家分享一篇解决layui数据表格table的横向滚动条显示问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 搞定immutable.js详细说明

    搞定immutable.js详细说明

    Immutable Data是指一旦被创造后,就不可以被改变的数据。通过使用Immutable Data,可以让我们更容易的去处理缓存、回退、数据变化检测等问题,简化我们的开发
    2016-05-05
  • 深入理解移动前端开发之viewport

    深入理解移动前端开发之viewport

    这篇文章主要介绍了移动前端开发之viewport的相关知识,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-10-10
  • js焦点文字滚动效果代码分享

    js焦点文字滚动效果代码分享

    这篇文章主要介绍了js焦点文字滚动效果,功能实现非常简单,推荐给大家,有需要的小伙伴可以参考下。
    2015-08-08
  • Echarts图表如何利用formatter自定义tooltip的内容和样式

    Echarts图表如何利用formatter自定义tooltip的内容和样式

    这篇文章主要给大家介绍了关于Echarts图表如何利用formatter自定义tooltip的内容和样式的相关资料,echarts的图表配置非常的灵活自由,但是不熟悉的时候容易不知道怎么配置,需要的朋友可以参考下
    2023-06-06
  • javascript 异步页面查询实现代码(asp.net)

    javascript 异步页面查询实现代码(asp.net)

    异步页面查询,其实与自动完成时一样的原理,根据用户输入的关键词自动的与数据库中的匹配,并显示出来,提高用户体验,但主要搜索量大的话,增加服务器开销。
    2010-05-05
  • indexOf 和 lastIndexOf 使用示例介绍

    indexOf 和 lastIndexOf 使用示例介绍

    indexOf是在一个字符串中寻找一个字的位置,lastIndexOf 也是找字 , 它们俩的区别是前者从字符串头开始找,后者是从字符串末端开始找
    2014-09-09

最新评论