Question

我正在使用Google-Extention，它允许我打开包含表单的新标签页。在填写并保存表单后，每次我再次打开此选项卡时，表单应该预先填充之前保存的数据。

以下是数据的保存方式：工作！

function saveCheckoutData() {

    var vName = document.getElementById('txbx_name').value;

    chrome.storage.sync.set({'name': vName}, function() {
        console.log(vName);
    })
}

以下是我获取数据的方式：工作！

function getdata() {    
        chrome.storage.sync.get('name', function(data) {
            var name = data.name;
            if(name != null){
                document.getElementById("txbx_name").value = name;
            }   
        });
}

上面的代码在点击按钮时调用，完美运行！

但是当我在标签打开时尝试执行此操作时，它无法正常工作（标签打开但文本框中没有任何内容）： DOESN＆＃39 ;工作！

function configAutofill(){   

    var newURL = "autofill_data.html";
    chrome.tabs.create({ url: newURL });

    chrome.storage.sync.get('name', function(data) {
        var name = data.name;
        if(name != null){
            document.getElementById("txbx_name").value = name;
        }   
    });   
}

是否有人知道为什么这些行在创建新标签时不起作用？

非常感谢提前。

Answer 1

这是给你的问题。

创建新标签后，您可以访问document.getElementById。是的，但哪个文件？

在您的情况下，它将是调用create的页面 - 不是创建的页面。

在您的情况下，您似乎打开的页面是扩展程序的一部分。然后你应该只包含将在加载时运行的代码。

您可以查看document.readyState：

if (document.readyState === "loading") {
  document.addEventListener('DOMContentLoaded', getdata);
} else {
  getdata();
}

如果您尝试使用网页执行此操作，则需要内容脚本。同样，那些通常在解析DOM之后执行 - 所以只需在顶级调用getdata()。

使用javascript在页面加载时使用数据填充TextBox

1 个答案: