1

我正在构建一个基于 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();

  });
}

到目前为止它工作正常。但是我这里有两个问题:

  1. 运行它的站点包含一些代码块。例如:
#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 + '<

我不知道。

4

0 回答 0