我创建了一个chrome扩展程序,允许用户在文本框中单击鼠标右键,然后插入特殊字符。这适用于许多站点,如StackOverflow,但不适用于Facebook等网站。这是因为Facebook没有使用标准文本框表单控件。而不是文本消息中的每一行,它似乎使用div > div > span > span
构造。有没有办法创建Chrome扩展程序来定位页面组件,例如?
我的Chrome扩展程序代码的一部分如下所示:
main.js:
chrome.contextMenus.create({
title: "\u038F",
contexts:["editable"],
onclick: function(info, tab){
chrome.tabs.sendMessage(tab.id, {action: "insertCharacter", character: '\u038F'});
}
});
content.js
chrome.extension.onMessage.addListener(function(request, sender, sendResponse){
var objField = document.activeElement;
if (request.action == "insertCharacter"){
insertAtCursor(objField, request.character);
}
});
function insertAtCursor(sField, sValue){
if (sField.selectionStart || sField.selectionStart == '0'){
var nStart = sField.selectionStart;
var nEnd = sField.selectionEnd;
sField.value = sField.value.substring(0, nStart) + sValue + sField.value.substring(nEnd, sField.value.length);
sField.selectionStart = nStart + sValue.length;
sField.selectionEnd = nStart + sValue.length;
}
else {
sField.value += sValue;
}
}
我是否有更通用的方法来处理不同网站上的各种情况?如果没有,有没有办法专门针对Facebook,因为大多数时候我(也可能是其他人)将在Facebook上使用我的扩展程序。 (当然,让它适用于像GMail这样的电子邮件网站也会带来好处。)
答案 0 :(得分:0)
如果它帮助了其他人,这就是我根据wOxxOm的建议修改我的代码:
chrome.extension.onMessage.addListener(function(request, sender, sendResponse){
if (request.action == "insertCharacter"){
insertAtCursor(request.character);
}
});
function insertAtCursor(sValue){
document.execCommand("insertText", false, sValue);
}
它比我原来的方法更紧凑,insertText
自动处理选择方面。