Chrome擴展程序 - 編輯文本字段

我正在嘗試編寫我的第一個Chrome擴展程序。點擊後，它會自動填寫我的大學登錄頁面（其表單的自動填充已禁用）的ID和密碼字段。這是一個非常具體的頁面。Chrome擴展程序 - 編輯文本字段

我有幾個問題。我搜索了Google和SO，但無法找到關於如何通過Chrome更改文本字段值的說明。我知道如何在HTML和JavaScript中做到這一點，但我無法獲得正確的輸入來修改其文本。

我也嘗試使用jQuery使用我發現的幾個例子，但沒有運氣。我有一個HTML頁面（popup.html），它調用一個JavaScript文件。我也試着放置JS的內容腳本

這裏的manifest.json的：

{ 
    "name": "My First Extension", 
    "version": "1.0", 
    "manifest_version": 2, 
    "description": "The first extension that I made.", 
    "browser_action": { 
    "default_icon": "icon.png", 
    "default_popup": "popup.html" 
    }, 
    "permissions": [ 
     "tabs", "http://*/*" 
    ], 
    "content_scripts": [ 
     { 
     "matches": ["http://*/*"], 
     "js": ["jquery-1.7.2.min.js","content.js"] 
     } 
    ] 
}

我的一個popup.js的企圖（這會從popup.html稱呼）的是：

chrome.tabs.getSelected(null, function(tab) { 
    console.log(document) 
});

我也試過把這段代碼放在content.js裏面。同樣的結果，它打印到控制檯，但它打印popup.html內容..

我也試過直接（和上面的方法）來直接document.getElementById()訪問一個元素，但仍然沒有運氣..

那麼，誰能告訴我我做錯了什麼？

來源

2012-08-07 La bla bla

將是更容易簡單地強制自動填充呢？ – Wug 2012-08-07 19:16:22

我不知道。 :)當我看到源代碼時，它表示autocomplete =「OFF」形式可以更改它，以便它可以自動完成並記住我輸入的內容？我不知道。另外，我想知道如何做到這一點。 – 2012-08-07 19:18:01

可能是您的擴展程序只能搜索禁用自動填充的表單並啓用它們。 – Wug 2012-08-07 19:19:02

您需要使用「web_accessible_resources」屬性將JavaScript文件注入頁面。在這裏看到：

manifest.json的

{ 
    "name": "My First Extension", 
    "version": "1.0", 
    "manifest_version": 2, 
    "description": "The first extension that I made.", 
    "browser_action": { 
    "default_icon": "icon.png" 
    }, 
    "permissions": [ 
     "tabs", "http://*/*" 
    ], 
    "content_scripts": [ 
     { 
     "matches": ["http://*/*"], 
     "js": ["jquery-1.7.2.min.js","content.js"], 
     "run_at": "document_start" 
     } 
    ], 
    "web_accessible_resources": ["inject.js"] 
}

inject.js

(function() { 
    console.log('test'); 
}());

content.js

(function (chrome) { 
    var js = document.createElement('script'); 
    js.type = 'text/javascript'; 
    js.src = chrome.extension.getURL('inject.js'); 
    document.getElementsByTagName('head')[0].appendChild(js); 
}(chrome));

然後，只需把你想用在inject.js中的JavaScript代碼放在頁面上。請務必將匹配項更改爲僅匹配您大學的登錄頁面。

原因是這種情況是因爲Chrome擴展程序可以獨立運行和運行，無論您使用的是哪個網站。當你切換頁面時，他們可以繼續處理。他們在自己的沙盒環境中。

來源

2012-08-07 19:17:49

它仍然不起作用。它做同樣的事情。我應該在哪裏打電話給inject.js？只在清單中？ – 2012-08-07 19:26:17

Yah。適用於我所做的擴展。儘管您將「匹配」更改爲您要操作的實際頁面，這一點很重要。 – 2012-08-07 19:28:58

PS - 如果您想使用JQuery，您還必須在「web_accessible_resources」中加載該庫。哦!並且不要忘記重新加載擴展名。就我個人而言，我總是忘記這麼做，並最終追蹤我第一次實際修復的錯誤。 ;-) – 2012-08-07 19:30:31

可能的解決方法（擴展名爲chrome）：Autocomplete = on，但它不適用於某些形式。

來源

2012-08-07 19:26:14

我想你應該使用在登錄頁面上執行的簡單內容腳本。您甚至不需要任何瀏覽器操作或彈出窗口。

這裏有一個清單：

{ 
    "name": "Fill my password", 
    "version": "1.0", 
    "manifest_version": 2, 
    "description": "Fills my password on University login page", 
    "content_scripts": [ 
     { 
      "matches": ["http://www.myuniversity.edu/login.html"], 
      "js": ["content.js"] 
     } 
    ] 
}

而這裏的內容腳本：

// define your username and password 
var myUsername = '...'; 
var myPassword = '...'; 

// find the fiends in your login form 
var loginField = document.getElementById('...'); 
var passwordField = document.getElementById('...'); 

// fill in your username and password 
loginField.value = myUsername; 
passwordField.value = myPassword; 

// if you want, you can even automaticaly submit the login form 
var loginForm = document.getElementById('...'); 
loginForm.submit();

來源

2012-08-08 04:34:32 Fczbkk

Chrome擴展程序 - 編輯文本字段

回答

相關問題