chrome扩展后台页面中的jQuery使用

2024-04-22

Goal

我正在尝试使用此样板代码使用在线词典 API 进行查找,以查找所选单词并返回定义。

Problem

我已经单独测试了实际的 jQuery ajax 调用,效果很好。另外,我可以在页面上获取所选的单词。然而,由于某种原因,我实际上遇到了问题callingSample.js 中的样板代码中的 ajax 函数

需要建议。

背景.html

<html>

  <script src="jquery.js"/>
  <script src="sample.js"/>

  <body>
    <p>
    Image here:
    </p>

    <img id="target" src="white.png" width="640" height="480">

  </body>
</html>

清单.json

{
  "name": "Context Menus Sample",
  "description": "Shows some of the features of the Context Menus API",
  "version": "0.6",
  "permissions": ["contextMenus"],
  "background": {
    "scripts": ["sample.js"],
    "pages": ["background.html"]
  },
  "manifest_version": 2
}

示例.js

     // A generic onclick callback function.
      function genericOnClick(info, tab) {
        console.log("item " + info.menuItemId + " was clicked");
        console.log("info: " + JSON.stringify(info));
        console.log("tab: " + JSON.stringify(tab));
        alert(info.selectionText);
        displayText(info.selectionText);
      console.log("asfasdf");
      $("#testID", document).html("testing jQuery");

      $.ajax({

          url: "http://api.wordnik.com//v4/word.json/cat/definitions?api_key=mykey&includeRelated=false&includeTags=false&limit=1",
          dataType : 'json',
          success: function(data) {
            //called when successful

            alert(data[0].word);

          },
          error: function(e) {
            //called when there is an error
            console.log(e.message);
          }
        });


  }


// Create one test item for each context type.
var contexts = ["page","selection","link","editable","image","video",
                "audio"];
for (var i = 0; i < contexts.length; i++) {
  var context = contexts[i];
  var title = "Test '" + context + "' menu item";
  var id = chrome.contextMenus.create({"title": title, "contexts":[context],
                                       "onclick": genericOnClick});
  console.log("'" + context + "' item:" + id);
}


// Create a parent item and two children.
var parent = chrome.contextMenus.create({"title": "Test parent item"});
var child1 = chrome.contextMenus.create(
  {"title": "Child 1", "parentId": parent, "onclick": genericOnClick});
var child2 = chrome.contextMenus.create(
  {"title": "Child 2", "parentId": parent, "onclick": genericOnClick});
console.log("parent:" + parent + " child1:" + child1 + " child2:" + child2);


// Create some radio items.
function radioOnClick(info, tab) {
  console.log("radio item " + info.menuItemId +
              " was clicked (previous checked state was "  +
              info.wasChecked + ")");
}
var radio1 = chrome.contextMenus.create({"title": "Radio 1", "type": "radio",
                                         "onclick":radioOnClick});
var radio2 = chrome.contextMenus.create({"title": "Radio 2", "type": "radio",
                                         "onclick":radioOnClick});
console.log("radio1:" + radio1 + " radio2:" + radio2);


// Create some checkbox items.
function checkboxOnClick(info, tab) {
  console.log(JSON.stringify(info));
  console.log("checkbox item " + info.menuItemId +
              " was clicked, state is now: " + info.checked +
              "(previous state was " + info.wasChecked + ")");

}
var checkbox1 = chrome.contextMenus.create(
  {"title": "Checkbox1", "type": "checkbox", "onclick":checkboxOnClick});
var checkbox2 = chrome.contextMenus.create(
  {"title": "Checkbox2", "type": "checkbox", "onclick":checkboxOnClick});
console.log("checkbox1:" + checkbox1 + " checkbox2:" + checkbox2);


// Intentionally create an invalid item, to show off error checking in the
// create callback.
console.log("About to try creating an invalid item - an error about " +
            "item 999 should show up");
chrome.contextMenus.create({"title": "Oops", "parentId":999}, function() {
  if (chrome.extension.lastError) {
    console.log("Got expected error: " + chrome.extension.lastError.message);
  }
});

您必须将在 ajax 函数中调用的 url 的权限添加到清单中:

  "permissions": [
    "contextMenus",
    "http://api.wordnik.com/*"
  ],

不要忘记包含 jquery:

"background": { "scripts": ["jquery.js", "sample.js"], "pages": ["background.html"] }

你不需要<script src="jquery.js"/>在你的文件中

网站链接末尾应有/*。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

chrome扩展后台页面中的jQuery使用 的相关文章

随机推荐

  • Python默认继承?

    如果我在Python中定义一个类 例如 class AClass slots a b c 它继承自哪个类 貌似没有继承object 如果定义一个类并且不声明任何特定的父类 则该类将成为 经典类 其行为与从对象继承的 新式类 略有不同 请参阅
  • 半素数分解的最佳算法是什么?

    半素数分解的最佳算法是什么 它可能与多重保理不同 对半素数进行因式分解的方式与对任何合数进行因式分解的方式相同 使用试除法和 pollard rho 来获得容易实现的目标 如果有的话 然后 p 1 p 1 和椭圆曲线 直到您确信因子太大 用
  • 仅西里尔文输入文本形式

    如何将输入文本限制为仅在 Web 表单文本框中输入Cyrillic人物 首先 您应该对页面和脚本使用支持西里尔字符 例如 UTF 8 的编码 然后 您可以使用正则表达式来检查 input keyup function this value
  • 为什么 ASP.NET DropDownList 控件需要单击两次才能在 Internet Explorer 中展开

    我有一个 ASP NET DropDownList 控件 它呈现到页面上的下拉列表 选择 HTML 标记 中 由于某种原因 当我使用 Internet Explorer 时 需要单击两次才能打开它并查看选项 这对最终用户来说只是额外的单击
  • 为什么使用成员数组而不是常量表达式调用 constexpr 函数?

    我有以下辅助功能 template
  • Codeigniter htaccess 和 base_url

    我安装了 codeigniter 并开始在上面编写一些代码 首先我想删除 index php 并对其进行一些研究 我用下面的一个小 htaccess 代码将其删除 RewriteEngine on RewriteCond 1 index p
  • link_to_remote 是否有等效的 :disable_with ?

    我有一个 link to remote 我想确保人们在等待它返回时只能单击它一次 有没有什么好的方法可以在有人点击后禁用它 更改链接的文本也很好 但我也想禁用它以确保 顺便说一句 这是 Ruby on Rails 您无法禁用链接 但您可以更
  • 在文件夹的上下文菜单中运行批处理文件

    当我右键单击任何文件夹时 我想运行此批处理文件 setenv cmd echo off SET CPLUS INCLUDE PATH C mingw32 include C mingw32 lib gcc mingw32 4 9 2 inc
  • 为什么create系统调用叫creat? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • RestKit 0.20.0pre5:每个请求的 HTTP 标头

    我想发送一个If Modified Since带有 GET 请求的 http 标头 由 RKObjectManager getObjectsAtPath the 迁移指南 https github com RestKit RestKit w
  • Maven 错误:也许您正在 JRE 而不是 JDK 上运行?

    我以前从未使用过 Maven 我正在按照说明进行操作here http ecmarchitect com alfresco developer series tutorials maven sdk tutorial tutorial htm
  • 使用类型类将 Haskell 中的值与类型关联起来

    我想使用类型类返回String功能上依赖于 Haskell 类型的实例 例如 假设我们有这样的类型Form 我想将字符串 form 与此类型相关联 给定类型Invocation 我想关联字符串 job 等等 重要的是我通常不会有相关类型的实
  • Shell 脚本读取缺少最后一行

    我的 bash shell 脚本有一个奇怪的问题 我希望能对此有所了解 我的团队正在开发一个脚本 该脚本会迭代文件中的行并检查每一行中的内容 我们遇到了一个错误 当通过将不同脚本排序在一起的自动化流程运行时 看不到最后一行 用于迭代文件中的
  • 为什么codeigniter2不以更安全的方式存储csrf_hash,例如会话?

    为什么生成的 CSRF 保护令牌没有像建议的那样通过 SESSION 保存和使用here http codeutopia net blog 2008 10 16 how to csrf protect all your forms 目前在C
  • Oracle 内联视图

    为什么使用内联视图 使用内联视图有许多不同的原因 有些事情没有内联视图就无法完成 例如 1 对解析函数的结果进行过滤 select ename from select ename rank over order by sal desc rn
  • 检查我的 SSRS 报告,代码中是否为空

    我正在加载我使用 SSRS 通过代码 C 完成的报告 但我需要检查报告是否为空 我怎样才能得到它 我使用的代码是 if string IsNullOrEmpty RptInstance FileName string ReportName
  • Javascript 将 URL 转换为 BASE64 图像

    我正在构建一个 Ionic2 应用程序 我正在尝试将图像 url 转换为 base64 图像 我已经发现this https stackoverflow com questions 22172604 convert image url to
  • iTextSharp 可以将 PDF 文档转换为 PDF/A

    我无法在常见问题解答中找到此功能是否存在于 API 中 尽管在一本书中提到它是可能可用的 有人有实施此功能的经验吗 On 这个线程 http old nabble com Added support for PDF A 1 td109714
  • 在 SQL Server 中的韩语单词(任何 Unicode 单词)中查找韩语字母表(任何 Unicode 字符)的索引

    我需要按姓名搜索人员 这里的人名可以是英文 韩文或中文 为此我使用了Like搜索条件Name如下 select from MyTable where Name like N t 上述声明是给所有包含字母的用户t 但这不适用于韩语或中文 就像
  • chrome扩展后台页面中的jQuery使用

    Goal 我正在尝试使用此样板代码使用在线词典 API 进行查找 以查找所选单词并返回定义 Problem 我已经单独测试了实际的 jQuery ajax 调用 效果很好 另外 我可以在页面上获取所选的单词 然而 由于某种原因 我实际上遇到