如何在chrome中右键单击时在突出显示的单词上创建“表单弹出框”？

-1

我在开始创建Chrome浏览器扩展时遇到了一些问题，如果用户突出显示某个单词，则会出现一个表单框，其中突出显示的单词以及用户可以添加的任何其他信息。图像是我想要创建的模型。我一直在关注Chrome开发人员扩展教程，但我不确定如何将其应用于此。（这个盒子的目的是稍后将它推送到数据库）。 Prototype Image of browser extension box 如何在chrome中右键单击时在突出显示的单词上创建“表单弹出框”？

来源

2016-05-17 Soccerplayerpro

为了实现这个目标，你需要做以下的事情：

倾听右键单击事件。看看Content Scripts和Click event，你可以使用下面的代码来监听右键单击事件。

document.addEventListener("click", function(e) { 
    if(e.button === 2) { 
     // right mouse button 
    } 
}, false);

获得突出显示的单词。你可以使用window.getSelection().toString()来获得。
创建一个弹出框。在内容脚本中，您可以直接在当前网页中操作DOM，只需拨打Document.createElement和Node.appendChild即可创建并注入您的元素。

来源

2016-05-18 00:48:09

你需要创建一个内容脚本是这样的：

function getSelectedText() { 
    var text = ""; 
    if (typeof window.getSelection != "undefined") { 
     text = window.getSelection().toString(); 
    } else if (typeof document.selection != "undefined" && document.selection.type == "Text") { 
     text = document.selection.createRange().text; 
    } 
    return text; 
} 

document.addEventListener('mouseup', function(e) { 
    var selectedText = getSelectedText(); 
    if (selectedText) { 
     alert("Selected text: " + selectedText); 
    } 
}, false);

来源

2016-05-18 22:25:02 Cornwell

如何在chrome中右键单击时在突出显示的单词上创建“表单弹出框”？

回答

相关问题