如果文本具有编码字符,则删除span标记

时间:2018-01-19 01:31:54

标签: javascript jquery

我希望删除在浏览器内编辑器中包装文本块的span标签,但是如果文本包含任何类型的特殊字符(例如换行符'\ n'或编码字符,如•等),则会遇到问题。

这是我的代码,适用于没有编码字符的句子

function fnIgnoreThisErr(evtTargID){    
    // use the passed parameter 
    var errIdx = evtTargID.substr(evtTargID.indexOf('err-') + 4);  
    // buld span tag for finding
    var errSpan = "span.err-" + evtTargID;
    // declare the editor
    var editor = CKEDITOR.instances.editor1;
    // get text from the editor
    var edata = editor.getData();  
    // find the specific span in the text
    var spanData = $( edata ).find(errSpan); 
    // get outerHTML and innerText to use for replacement
    var myCurrText = spanData[0].outerHTML;
    var myNewText = spanData[0].innerHTML;
    // standard js replace works if no special chars
    var replace_text = edata.replace(myCurrText, myNewText);  //
    // sets the data back in CKEditor
    editor.setData(replace_text);
}

以下是带有span标记的文本示例 myCurrText:

<span class=\"vts-warn vts-ParseFailure err-2\">Approval of ICA<br />\n&nbsp; GAMA requested further clarification of proposed &sect;&sect;25.1739 (now &sect;25.1729) and 25.1805(b) (now &sect;26.11(b)) requirements that ICA prepared in accordance with paragraph H.</span>

删除了span标记。

Approval of ICA<br />\n&nbsp; GAMA requested further clarification of proposed &sect;&sect;25.1739 (now &sect;25.1729) and 25.1805(b) (now &sect;26.11(b)) requirements that ICA prepared in accordance with paragraph H.

它在没有任何编码字符的普通句子上效果很好。我可以切换到jQuery但无法使用replaceWith工作。

我在这里缺少什么?

1 个答案:

答案 0 :(得分:0)

我明白了。 html实体与浏览器和我的JS呈现/解释它们的方式之间似乎存在差异 即,span的outerHTML不是edata中文本的字符匹配。

所以我只获得了span的开始和span节点长度的indexOf值。但是,由于提到的差异,此长度可能包括其他字符。那么,接下来,我找到了&#39;&#39;&#39;&#39;标签。从那里,我构建了一个与需要替换的文本完全匹配的字符串变量。

这是我的最终代码。 (为了清晰起见,我保持长篇形式)

function fnIgnoreThisErr(evtTargID){    
    // use the passed parameter 
    var errIdx = evtTargID.substr(evtTargID.indexOf('err-') + 4);  
    // buld span tag for finding
    var errSpan = "span.err-" + evtTargID;
    // declare the editor
    var editor = CKEDITOR.instances.editor1;
    // get text from the editor
    var edata = editor.getData();  
    // find the specific span in the text
    var spanData = $( edata ).find(errSpan); 
    // extract the span class name
    var spanTag = '<span class="'+spanData[0].className+'">'
    // find indexOf value for the span opening tag
    var spanPos = edata.indexOf(spanTag);
    // get the initial length of the span.
    var spanLength = spanData[0].outerHTML.length;
    // get the actual text from that span length.
    var spanString = edata.substring(spanPos,spanPos+spanLength);
    // find the acutal position of the span closing tag
    var spanClose = spanString.indexOf('</span>');
    var spanTagClosePos = spanClose+7;
    // extract the true text comprising the span tag
    var spanStringMod = edata.substring(spanPos,spanPos+spanTagClosePos);
    var spanInnerHtm = spanData[0].innerHTML;
    log("errSpan: "+ errSpan);
    log("errSpanClass: "+ errSpanClass);
    log("spanData: "+  JSON.stringify(spanData));
    log("spanPos: "+ spanPos);
    log("spanTagClosePos: "+ spanTagClosePos);
    log("spanStringMod: "+ spanStringMod);
    log("spanInnerHtm: "+ spanInnerHtm);
    var newEdata = edata.replace(spanStringMod, spanInnerHtm);  
    log(" newEdata: "+ newEdata);   
    // update the editor
    editor.setData(newEdata);
}

我希望这会在某个时间帮助某个人!

干杯!