Question

我发现这个伟大的扩展在功能方面完全符合我的要求，例如它切换隐藏的输入字段并使它们可见。

我唯一想弄清楚的是如何制作它以便它可以作为扩展图标按钮而不是快捷键组合？

扩展： https://chrome.google.com/webstore/detail/hidden-field-switcher/gfkfklknjmlpldiggcjgdgkonoicfngp

谢谢

我当前的设置：我已经能够添加按钮，但点击它不会做任何事情：

Manifest.json

{
 "name": "Display Hidden",
 "version": "1.0",
 "manifest_version": 2,
 "description": "Display hidden",
 "background": {"page": "background.html", "persistent": false},
 "browser_action": {"default_icon": "icon.png"},
 "content_scripts":[{"js": ["background.js"], "matches": ["https://*/*"]}],
 "permissions": ["tabs", "http://*/*"]
}

background.html

<html>
 <head>
  <script src="background.js">
   chrome.browserAction.onClicked.addListener(function(tab) {alert('icon clicked')});
  </script>
 </head>
</html>

background.js Source

var allFields = new Array();
var visible = false;

function switchHidden() {
 if(visible == true){
     hideHidden();
     visible = false;
}
  else {
      showHidden();
      visible = true;
  }

}

function showHidden() {
    var allHidden = document.getElementsByTagName("input");
    for (var Key in allHidden) {
        if(allHidden[Key].type == "hidden") {
           allFields.push(allHidden[Key]);
           allHidden[Key].type = "text";

           /*for (var SettingsKey in Settings) {
           var subSection = SettingsKey.substring(7,0);
           var subKey = SettingsKey.substring(7);
           if(subSection == "styles_") {
           allHidden[Key].style.setProperty(subKey,Settings[SettingsKey]);
           }
       }*/

if(allHidden[Key].name)
     allHidden[Key].title = allHidden[Key].name;
      if(!allHidden[Key].name && allHidden[Key].id)
     allHidden[Key].title = allHidden[Key].id;
     allHidden[Key].style.setProperty("background-color","#CCFFFF");
       } 
    }
}

function hideHidden() {
    for (var Key in allFields) {
        allFields[Key].type = "hidden";
    }
    allFields = new Array();
}

隐藏字段切换器图标按钮选项

0 个答案: