首页 > 解决方案 > 用wordpress写JS

问题描述

toggler.addEventListener('click', toggleMB);

devtools 显示,上面一行中的 AddEventListener 是类型错误。wordpress正常,不支持js,还是依赖脚本入队规则?

这如果是完整的脚本文件:

let toggler = document.querySelector('.menutoggle');
let mbMenu = document.querySelector('.sidemenu');
let mbMenuBack = document.querySelector('.sidelayout');
// let marker = document.querySelector('.ltbottommenu');

  function toggleMB(){
      console.log('hooh')
      mbMenu.classList.toggle('sidemenu__active');
        
        
      if (mbMenu.classList.contains('sidemenu__active')) {
          toggler.childNodes[0].src = "/assets/img/cross.svg"
          toggler.classList.add('menutoggle__active');
          mbMenuBack.classList.add('sidelayout__show');
      }
      else {
          toggler.classList.remove('menutoggle__active');
          mbMenuBack.classList.remove('sidelayout__show');
          toggler.childNodes[0].src = "/assets/img/menu.svg"
      }

  };

  toggler.addEventListener('click', toggleMB);

  mbMenuBack.addEventListener('click', toggleMB);

这是 wordpress 中 function.php 文件中的脚本:

wp_enqueue_script ( 'script-main', get_template_directory_uri() . '/assets/js/main.js', array(), '1.0.0', false);

标签: javascriptphpwordpress

解决方案


尝试删除()frommbMenuBack.addEventListener('click', toggleMB());以成为:mbMenuBack.addEventListener('click', toggleMB);第二个参数必须是函数而不是函数的结果。

最好将它们实现为匿名函数或使用更新的技术。

参考:https ://www.w3schools.com/jsref/met_element_addeventlistener.asp


推荐阅读