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

如何在window.matchMedia中添加removeEventListener?

如何在window.matchMedia中添加removeEventListener?

一只名叫tom的猫 2023-12-14 16:24:32
这是我的问题:我想要一个仅适用于小于“400px”的浏览器尺寸的“addEventListener”点击方法。但是当我们调整浏览器大小时,我想删除这个方法。我的代码的格式如下。如果我的浏览器尺寸超过 400px,我会继续使用该方法。我需要你的帮助。function customFunction(x) {    var cardClick = document.getElementsByClassName("card");    var inner = document.getElementsByClassName("card-inner");    if (x.matches) {        cardClick[0].addEventListener("click", cardFunction);        function cardFunction() {            // some code            // inner[0].style......        }    } else {        cardClick[0].removeEventListener("click", cardFunction);    }}var x = window.matchMedia("(max-width: 400px)");customFunction(x);x.addListener(customFunction);
查看完整描述

2 回答

?
胡子哥哥

TA贡献1825条经验 获得超6个赞

“使用不标识 EventTarget 上当前注册的任何 EventListener 的参数调用 removeEventListener() 没有任何效果。”


每次调用 customFunctions 时,您都会定义新版本的卡函数,因此您无法将其与元素分离,因为它与您附加的函数不同。


function cardFunction() {

   // some code

   // inner[0].style......

}


function customFunction(x) {


    var cardClick = document.getElementsByClassName("card");

    var inner = document.getElementsByClassName("card-inner");


    if (x.matches) {

        cardClick[0].addEventListener("click", cardFunction);


    } else {

        cardClick[0].removeEventListener("click", cardFunction);

    }

}


var x = window.matchMedia("(max-width: 400px)");

customFunction(x);

x.addListener(customFunction);

javascript


查看完整回答
反对 回复 2023-12-14
?
慕容3067478

TA贡献1773条经验 获得超3个赞

x.removeListener(customFunction)

检查此处的示例:https ://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/removeListener


查看完整回答
反对 回复 2023-12-14
  • 2 回答
  • 0 关注
  • 118 浏览
慕课专栏
更多

添加回答

举报

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