只有第一个值从chrome扩展选项页面保存到chrome存储

时间:2017-01-22 19:38:19

标签: google-chrome-extension google-chrome-storage

背景 构建一个简单的chrome扩展,修改URL以从prod切换到dev到staging(在Salesforce中)。

这都是通过非常简单的URL操作,即

prod: https://na2.salesforce.com/01Q400000007RVr
dev: https://cs14.salesforce.com/01Q400000007RVr
staging: https://cs8.salesforce.com/01Q400000007RVr

扩展可以在扩展名中使用硬编码的实例ID(na2,cs14,cs8)正常工作。我正在努力添加一个允许我设置ID的选项页面。

问题: 我正在调整样本provided by Google here。我能够设置并获取第一个值(prod),但第二个值似乎保持空白,因此会在扩展中引发错误。

我认为第二个值是空白的,因为当我在两个输入字段中输入值,然后单击“保存”并重新加载时,只会填充prod。截图即将到来 - 目前尚未在SE中加载。

以下代码。试图插入片段但有问题。

OPTIONS.HTML

<!DOCTYPE html>
<html>
<head>
  <title>My Test Extension Options</title>
  <style>
    body: { padding: 10px; }
  </style>
</head>

<body>
    Prod <br />
    <input type="text" id="prod"> <br />
    Dev <br />
    <input type="text" id="dev">  <br />

  <div id="status"></div>
  <button id="save">Save</button>
  <script src="options.js"></script>
</body>
</html>

OPTIONS.JS

// Saves options to chrome.storage.sync.
function save_options() {
  var prodval = document.getElementById('prod').value;
  var devval = document.getElementById('dev').value;
  console.log('prodval = ' + prodval);
  console.log('devval = ' + devval);
  chrome.storage.sync.set({
    prod: prodval,
    dev: devval
  }, function() {
    // Update status to let user know options were saved.
    var status = document.getElementById('status');
    status.textContent = 'Options saved.';
    setTimeout(function() {
      status.textContent = '';
    }, 750);
  });
}

// Restores select box and checkbox state using the preferences
// stored in chrome.storage.
function restore_options() {
  // Use default value color = 'red' and likesColor = true.
  chrome.storage.sync.get({
    prod: 'na3',
    dev: 'cs14'
  }, function(items) {
    document.getElementById('prod').value = items.prod;
    document.getElementById('dev').checked = items.dev;
  });
}
document.addEventListener('DOMContentLoaded', restore_options);
document.getElementById('save').addEventListener('click',
    save_options);

0 个答案:

没有答案