Question

以下代码从我的options.html调用：

 $('#go-button').click(function () {
        var selectedCategories = GetSelectedCategories();
        chrome.storage.local.set({ 'selectedCategories': selectedCategories }, function () {
            console.log('this function is called!');
            chrome.storage.local.get('selectedCategories', function (result) {
                console.log('local.get result: ' + result.selectedCategories);
            })
            //window.close();
        });
    });

seceltedCategories var很好 - 我已经在控制台中查看了。均值，GetSelectedCategories()方法正常工作。

但console.log('local.get result: ' + result.selectedCategories);永远不会被召唤！

console.log('this function is called!');在第二次点击相应按钮后开始调用。这是否意味着我不能使用options.js来访问storage.local？

<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="/bower_components/jquery.min.js"></script>
  <script type="text/javascript" src="options.js"></script>
</head>
<body>
  <form id="listOfCategories_form" />
  <button id="go-button">Go!</button>
</body>
</html>

我需要将这些类别添加到我的内容脚本中。

Answer 1

FORM不是void element，因此在其开始代码的末尾写/>并不会将其关闭：

开始标记由以下部分组成，完全按以下顺序排列：


A“＆lt;”字符。

元素的标记名称。

（可选）一个或多个属性，每个属性必须以一个或多个空格字符开头。

（可选）一个或多个空格字符。

可选地，“/”字符，仅当元素是空白元素时才可以出现。

A“＆gt;”字符。

BUTTON元素实际上位于表单中，如元素检查器中所示，因此在单击时提交表单，重新加载文档，如devtools网络面板中所示。

解决方案：

使用点击处理程序中的return false来阻止默认事件操作：jQuery将其转换为event.preventDefault()和event.stopPropagation()。
使用type="button"属性：<button type="button" id="go-button">Go!</button>

从options.html访问chrome.storage.local.set / get的问题

1 个答案: