如何在 HTML 中显示消息并关闭设置窗口?

我正在开发一个 chrome 扩展,我希望能够在单击“完成”按钮时得到响应,设置窗口应该关闭并且用户将收到一条消息:


这是设置页面的代码: settings.html


    <html>

   <head>

      <meta http-equiv="content-type" content="text/html; charset=utf-8" />

      <link rel="stylesheet" type="text/css" href="../styles/settings.css">

      <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

      <title>SSS- Settings</title>

   </head>

   <body>

      <div class="wrapper">

         <div class="card">

            <div class="card__header">

               <div class="toolbar">

                  <div class="toolbar__item toolbar__item--close"></div>

                  <div class="toolbar__item toolbar__item--min"></div>

                  <div class="toolbar__item toolbar__item--max"></div>

.....................................................(other settings)

<br>

                     <div class="buttons"><a href="#"></a><button onclick="closeFunction()" id = "save_settings" class="button">Done</button></div>

                  </div>

               </div>

            </div>

         </div>

      </div>

      <script src="../assets/js/settings.js"></script>

      <script>

      function closeFunction() {

          close();

      }

      </script>

   </body>

</html>

设置.js


console.clear();


toggle = document.querySelectorAll('.toggle');

const fno = document.getElementById('fake-news-opt');

const hso = document.getElementById('hate-speech-opt');

const cbo = document.getElementById('click-baits-opt');

const pwo = document.getElementById('profanity-words-opt');

const save_button = document.getElementById('save_settings');





.............


qq_遁去的一_1
浏览 71回答 1
1回答

呼啦一阵风

因此,根据我的理解,您试图在单击“完成”按钮时关闭窗口,如果是这样:您可以onclick从按钮标签中删除该属性并将 an 附加EventListener到按钮本身,如下所示:save_button.addEventListener("click",&nbsp;()&nbsp;=>&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;close(); }
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Html5