如何在复制和粘贴时处理满足的URL相对/绝对“故障”

时间:2014-02-12 13:53:04

标签: anchor contenteditable relative-path absolute-path clipboard-interaction

contenteditable区域中,如果您粘贴带有网址属性的元素,在某些浏览器中,则会将网址从 relative 转换为 absolute < /强>

我已经阅读了一些声称已经修复过的错误报告&#34;在最新版本中,但事实并非如此。

我把这个小提琴放在一起演示: Hurray for Demos!

它在那里,它很难看,而且我想知道解决它的最佳方法是什么。

  1. 我想到的第一个想法是onpaste,找到当前节点中的所有anchorsparse it with regex。我想这不太理想,但可能有效。

  2. ???

  3. ???
  4. 我真的希望他们只是把事情单独处理,而不是用contenteditable创建这么多与浏览器相关的问题,但我想这会让它变得太容易

    有关解决此问题的最佳方法的任何想法吗?

1 个答案:

答案 0 :(得分:1)

在让浏览器破解数据之前,

CKEditor会将所有srcnamehref属性复制到data-cke-saved-src|href属性。不幸的是,由于数据是字符串,因此必须通过regexp完成。您可以在此处找到代码:/core/htmldataprocessor.js#L772-L783

var protectElementRegex = /<(a|area|img|input|source)\b([^>]*)>/gi,
    // Be greedy while looking for protected attributes. This will let us avoid an unfortunate
    // situation when "nested attributes", which may appear valid, are also protected.
    // I.e. if we consider the following HTML:
    //
    //  <img data-x="&lt;a href=&quot;X&quot;" />
    //
    // then the "non-greedy match" returns:
    //
    //  'href' => '&quot;X&quot;' // It's wrong! Href is not an attribute of <img>.
    //
    // while greedy match returns:
    //
    //  'data-x' => '&lt;a href=&quot;X&quot;'
    //
    // which, can be easily filtered out (#11508).
    protectAttributeRegex = /([\w-]+)\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|(?:[^ "'>]+))/gi,
    protectAttributeNameRegex = /^(href|src|name)$/i;

function protectAttributes( html ) {
    return html.replace( protectElementRegex, function( element, tag, attributes ) {
        return '<' + tag + attributes.replace( protectAttributeRegex, function( fullAttr, attrName ) {
            // Avoid corrupting the inline event attributes (#7243).
            // We should not rewrite the existed protected attributes, e.g. clipboard content from editor. (#5218)
            if ( protectAttributeNameRegex.test( attrName ) && attributes.indexOf( 'data-cke-saved-' + attrName ) == -1 )
                return ' data-cke-saved-' + fullAttr + ' data-cke-' + CKEDITOR.rnd + '-' + fullAttr;

            return fullAttr;
        } ) + '>';
    } );
}

然后,在处理从可编辑元素中获取的HTML时,data-cke-saved-*属性会覆盖原始属性。