首页 > 解决方案 > ReferenceError 切换未定义 | '$' 已定义但从未使用过。(no-unused-vars) eslint | 'toggle' 已定义但从未使用过。(没有未使用的变量)

问题描述

我想切换按钮以在 ON 状态和 OFF 状态之间切换。当按钮打开并单击它时,它会关闭并且其中的文本会从 ON 变为 OFF,反之亦然。现在在这里。

JavaScript 代码

import $ from "jquery";

const root = document.getElementById("root");
root.innerHTML = '<button id = "btn" onclick = "toggle()">OFF</button>';
function toggle()
{
      var i = document.getElementById("btn");
      
      if(i.innerHTML==="ON")
      {
        i.innerHTML = "OFF";
      }
      else
      {
        i.innerHTML = "ON";
      }

}

HTML 代码

<!DOCTYPE html>
            <html>
              <head>
                <title>JavaScript App</title>
                <meta charset="UTF-8" />
              </head>
              <body>
                <div id="root"></div>
                <script src="src/index.js"></script>
              </body>
            </html>

每次单击按钮时,我都尝试使用切换方法切换状态:当然,我得到了 Uncaught ReferenceError: toggle is not defined。那么我该如何实现呢?

提前致谢。

const root = document.getElementById("root");
root.innerHTML = '<button id = "btn" onclick = "toggle()">OFF</button>';
function toggle()
{
      var i = document.getElementById("btn");
      
      if(i.innerHTML==="ON")
      {
        i.innerHTML = "OFF";
      }
      else
      {
        i.innerHTML = "ON";
      }

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="root"></div>
<script src="src/index.js"></script>

标签: javascriptjquery

解决方案


推荐阅读