Question

尝试进行Chrome扩展程序开发。问题是我不知道如何使用JavaScript。

目前我认为问题在于我不知道如何调用或定义函数。

调用page_PostData（）会导致未定义的异常：

VM150：13异常： ReferenceError：未定义page_postData

此示例稍加修改，来自示例扩展程序Chrome查询：

https://developer.chrome.com/extensions/examples/api/devtools/panels/chrome-query.zip

devtools.js

function page_postData(variableData) {

    console.log("Trying to do AJAX POST...");
};


function page_getData() {

    try {

        console.log("Trying to get data..");

        // Not defined.
        page_postData("Test1");

    } catch (exception) {

        console.log("Exception ocurred:\n" + exception.toString());
    }

    return $0;
};


chrome.devtools.panels.elements.createSidebarPane(
    "Element Properties",
    function(sidebar) {
  function updateElementProperties() {
    sidebar.setExpression("(" + page_getData + ")()");
  }
  updateElementProperties();
  chrome.devtools.panels.elements.onSelectionChanged.addListener(
      updateElementProperties);
});

的manifest.json

{
    "manifest_version": 2,
    "name": "Chrome Extension Test",
    "version": "0.1",
    "description": "Dev tools test extension",
    "devtools_page": "devtools.html",
    "background": {
        "scripts": ["devtools.js"]
    },
    "permissions": [
        "tabs", 
        "http://*/*", 
        "https://*/*"
    ]
}

devtools.html

<html>
<body>
<script src="devtools.js"></script>
</body>
</html>

如何正确定义'page_postData（）'？

如何正确调用'page_getData（）'中的'page_postData（）'？

Answer 1

要从page_postData()运行page_getData()，您需要传递正确的上下文。您应该详细了解bind和apply函数。在您的示例中，您可以通过以下方式呼叫page_getData()：page_getData.bind(this)()。

Answer 2

上下文问题，因为表达式将在被检查页面的上下文中进行评估，所以page_postData没有定义。

您可以创建IIEF来包装这两个函数，示例代码如下：

function run() {
    function page_postData(variableData) {
        console.log("Trying to do AJAX POST...");
    }

    return (function page_getData() {
        try {
            console.log("Trying to get data..");
            page_postData("Test1");
        } catch (exception) {
            console.log("Exception ocurred:\n" + exception.toString());
        }
        return $0;
    })();
}

chrome.devtools.panels.elements.createSidebarPane(
    "Element Properties",
    function(sidebar) {
        function updateElementProperties() {
            sidebar.setExpression('(' + run + ")()");
        }
        updateElementProperties();
        chrome.devtools.panels.elements.onSelectionChanged.addListener(updateElementProperties);
    }
);

Javascript - 没有定义ReferenceError x（函数）

2 个答案: