Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/clojure/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Chrome扩展的HTML/Javascript不太有效_Javascript_Html_Google Chrome Extension - Fatal编程技术网

Chrome扩展的HTML/Javascript不太有效

Chrome扩展的HTML/Javascript不太有效,javascript,html,google-chrome-extension,Javascript,Html,Google Chrome Extension,所以我想做一个chrome扩展。当我将代码作为普通html页面运行时,它可以正常工作,但当我使用浏览器操作时,我的启用/禁用按钮不起作用。当我按下enable时,它什么也不做,它应该切换到disable。我想知道是否有什么我不知道的,比如权限之类的。我没有在json页面中设置任何权限,但我认为这不是问题所在。我想知道你们能不能看看我遗漏了什么。这是我的密码 <html> <head> <link rel="stylesheet" type="

所以我想做一个chrome扩展。当我将代码作为普通html页面运行时,它可以正常工作,但当我使用浏览器操作时,我的启用/禁用按钮不起作用。当我按下enable时,它什么也不做,它应该切换到disable。我想知道是否有什么我不知道的,比如权限之类的。我没有在json页面中设置任何权限,但我认为这不是问题所在。我想知道你们能不能看看我遗漏了什么。这是我的密码

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="nosidebar.css">
        <script type="text/javascript">
            function enableBtn(){
                document.getElementById("btn1").style.display = "none";
                document.getElementById("btn2").style.display = "";
                return false;
            }

            function disableBtn(){
                document.getElementById("btn2").style.display = "none";
                document.getElementById("btn1").style.display = "";
                return false;
            }

        </script>
    </head>
    <body>
    <div id="button">
        <a href="javascript:void(0)" class="myButton1" title="Click to disable" id="btn1" style="display:;" onclick="enableBtn(); return false;">Enabled</a>
        <a href="javascript:void(0)" class="myButton2" title="Click to enable" id="btn2" style="display:none;" onclick="disableBtn(); return false;">Disabled</a>
    </div>
    <div id="text">
        You must refresh the page for the change to take effect.
    </div>
    </body>
</html>

作为Google Chrome扩展的一部分使用的HTML页面总是有一个内容安全策略集,该策略集禁止在属性(例如onclick和inline标记)中使用内联脚本。您需要在单独的Javascript文件中定义这些脚本,并在该脚本中绑定事件处理程序,例如

<script src="nosidebar.js"></script>
有关内容安全策略及其与Chrome扩展的关系的更多信息,请参阅:


作为Google Chrome扩展的一部分使用的HTML页面总是有一个内容安全策略集,该策略集禁止在属性(例如onclick和inline标记)中使用内联脚本。您需要在单独的Javascript文件中定义这些脚本,并在该脚本中绑定事件处理程序,例如

<script src="nosidebar.js"></script>
有关内容安全策略及其与Chrome扩展的关系的更多信息,请参阅:


澄清那是在哪里。弹出窗口?内容?@ZigMandel抱歉,这是弹出页面。我想duskwuff回答了我的问题,但我需要在今天有空的时候试一试。@Ben强烈建议您将您的解决方案作为另一个答案发布,而不是编辑到问题中。请澄清它在哪里。弹出窗口?内容?@ZigMandel抱歉,这是弹出页面。我想duskwuff回答了我的问题,但我今天有空的时候需要试一试。@Ben强烈建议您将解决方案作为另一个答案发布,不要编辑到问题中。
function enableBtn() { ... }
function disableBtn() { ... }

document.getElementById("btn1").addEventListener("click", enableBtn);
document.getElementById("btn2").addEventListener("click", disableBtn);