我正在构建一个基于 jQuery 的工具提示插件。到目前为止,它工作正常。
terms
是一个数组,其中包含要在站点上标记的单词。标记为存储在带有样式的跨度中的单词。
将鼠标悬停在跨度上时,会显示工具提示。
这是标记单词的功能:
function mark_terms(callback){
terms.forEach(function(entry) {
$('#tooltipped_area :not(script)').contents().filter(function() {
return this.nodeType === 3;
}).replaceWith(function() {
regex = new RegExp('\\s\\b' + entry + '\\b\\s', "gi");
return this.nodeValue.replace(regex, ' <span class="define" onMouseOver="show_tooltip(this.id)" onMouseOut="clear_timer()" id="' + entry + '">' + entry + '</span> ');
});
callback();
});
}
到目前为止它工作正常。但是我这里有两个问题:
- 运行它的站点包含一些代码块。例如:
#include <Morse.h>
用我的方法..字符串<Morse.h>
也被替换了......所以替换后它是不可见的。我认为因为它原来是一个“html元素”<Morse.h>
我怎样才能解决这个问题?
第二个问题是:
<span class="define" onMouseOver="show_tooltip(this.id)" onMouseOut="clear_timer()" id="' + entry + '">' + entry + '</span>
我如何才能暂时保护将被替换的术语,它与之前的后记相同。
>' + entry + '<
这会将旧词如 HelLoWoRld 转换为 HelloWorld。(HelloWorld 是存储在工具提示中的 DB 中的“标题”)
我需要这样的东西:
var temp_word_that_will_be_replaced = HelLoWoRld;
>' + temp_word_that_will_be_replaced + '<
我不知道。