我正在开发一个 Chrome 扩展程序。我这里有这个功能:
function makeEditableAndHighlight(colour) {
var range, sel = window.getSelection();
if (sel.rangeCount && sel.getRangeAt) {
range = sel.getRangeAt(0);
}
document.designMode = "on";
if (range) {
sel.removeAllRanges();
sel.addRange(range);
}
// Use HiliteColor since some browsers apply BackColor to the whole block
if (!document.execCommand("HiliteColor", false, colour)) {
document.execCommand("BackColor", false, colour);
}
document.designMode = "off";
}
function highlight(colour) {
var range, sel;
if (window.getSelection) {
// IE9 and non-IE
try {
if (!document.execCommand("BackColor", false, colour)) {
makeEditableAndHighlight(colour);
}
} catch (ex) {
makeEditableAndHighlight(colour)
}
} else if (document.selection && document.selection.createRange) {
// IE <= 8 case
range = document.selection.createRange();
range.execCommand("BackColor", false, colour);
}
}
我用它来突出显示(背景颜色为黄色)一段选定的文本。问题在于取消突出显示它。
我这样做了:
function body() {
document.getElementsByTagName("body")[0].addEventListener(
"click",
function(event){
highlight('transparent');
}
);
}
问题在于:
1)它需要仍然选择文本,但单击取消选择它,所以它只有在您重新选择完全相同的文本时才有效,并实际单击 ON IT。
2)它似乎使页面运行得更慢,甚至有时锁定它。
我想做的是:
当我在任何地方点击离开时,文本被取消突出显示和取消选择(基本上,每当取消选择文本时,将突出显示设置为透明或之前的任何内容)。
做什么?
PS - 仅限 Javascript。如果您有使用 jQuery 的方法,请告诉我,但请记住,我必须在为 Chrome 扩展提交的 content.js 中使用它。