我正尝试从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中使用快速入门时-请参阅“入门”)?
添加回答
举报
0/150
提交
取消