为了账号安全,请及时绑定邮箱和手机立即绑定

脚本模块和onclick处理程序的Material Design Web 1.0快速入门问题

脚本模块和onclick处理程序的Material Design Web 1.0快速入门问题

翻过高山走不出你 2021-04-30 18:31:49
我正尝试从2019年3月起开始使用Material Design Web 1.0。但是一开始我有一个问题: <!DOCTYPE html>    <html>      <head>        <meta charset="UTF-8"/>        <meta http-equiv="Content-Security-Policy" content="default-src 'self' https://fonts.gstatic.com; script-src 'unsafe-inline' https://unpkg.com; style-src 'unsafe-inline' https://unpkg.com https://fonts.googleapis.com"/>        <meta http-equiv="x-ua-compatible" content="ie=edge">        <meta name="viewport" content="width=device-width, initial-scale=1">        <title>Test</title>        <link href="https://unpkg.com/material-components-web@latest/dist/material-components-web.css" rel="stylesheet"/>        <script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.js"></script>        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/>            <script type="module">          const menu = mdc.menu.MDCMenu.attachTo(document.querySelector('.mdc-menu'));          menu.open = false;        </script>      </head>      <body>        <header class="mdc-top-app-bar mdc-top-app-bar--fixed mdc-menu-surface--anchor">          <div class="mdc-top-app-bar__row">            <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">              <a href="#" class="material-icons mdc-top-app-bar__navigation-icon" onclick="menu.open = !menu.open;">menu</a>              <span class="mdc-top-app-bar__title">Test</span>            </section>            <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">            </section>          </div>我的问题是,对于onclick="menu.open = !menu.open;"浏览器控制台来说,它是未定义的。那是因为<script type="module">。但是,删除type="module"时,script标记的内容将引发错误,提示未定义内容。所以我的问题是:什么是在onclick处理程序中打开/关闭菜单的正确方法(在unpkg.com中使用快速入门时-请参阅“入门”)?
查看完整描述

1 回答

  • 1 回答
  • 0 关注
  • 175 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信