将搜索引擎上下文菜单项添加到textarea

时间:2016-10-16 22:28:30

标签: javascript jquery

是否可以在textarea的右键单击上下文菜单中添加“搜索Google”功能?我希望有这样的功能,当你在textarea中选择一些文本时,如果你右键单击它,你就有了一个上下文条目,允许你在Google中搜索那个特定的文本。这非常类似于在右键单击页面但聚焦到文本区域时在浏览器中找到的上下文菜单条目。

我看到有一个.contextmenu事件https://api.jquery.com/contextmenu/,当我右键单击我的textarea时,我已经能够弹出一个警告弹出窗口,但我正在寻找另一个条目默认textarea菜单将与“搜索Google”一致,事件为http://www.google.com/search?q=STSTST,其中'STSTST'是textarea中的选定文本,如果您单击该上下文菜单条目,Google将搜索所选内容文本。

1 个答案:

答案 0 :(得分:3)

这是一个演示 http://codepen.io/mozzi/pen/EgZvjg

注意:你不应该在这里提出这类问题,你应该已经有了一个解决方案,但是错误!我发现它很有趣所以我做了一个演示! :)

这是演示的核心逻辑

$("#txtAboutMe").bind("contextmenu", function(event) {

  // Avoid the real one
  event.preventDefault();
  //alert(getSelectionText());
  selectedText = getSelectionText();
  $("[data-action='first']").text('Search Bing for "'+selectedText+'"');
  $("[data-action='second']").text('Search Google for "'+selectedText+'"');
  $("[data-action='third']").text('Search Yahoo for "'+selectedText+'"');
  // Show contextmenu
  $(".custom-menu").finish().toggle(100).

  // In the right position (the mouse)
  css({
    top: event.pageY + "px",
    left: event.pageX + "px"
  });
});