正文

删除侦听器类不会停止与 Jquery Javascript 相关的声音事件

 2023-02-25  219

关键词：

【中文标题】删除侦听器类不会停止与 Jquery Javascript 相关的声音事件【英文标题】：Removing a listener class doesn't stop a sound event associated Jquery Javascript 【发布时间】：2016-11-10 12:04:43 【问题描述】：

我在将鼠标悬停在图像上时播放声音（这已经可以正常工作了），并且希望包含一个按钮以在需要时将其关闭。不幸的是，我无法让它工作。

我当前的代码如下：

用于创造声音

//a bunch of code to generate the audio that ends on

var mouseoversound = createsoundbite('mysound.mp3')

用于触发它

  $(".play").mouseover(function() 
      mouseoversound.play();
    );

监听器元素

<%= image_tag "image.png", class:'logo-image play' %>

我认为禁用它的最简单解决方案是删除元素侦听器中事件的“侦听”类（即“.play”），所以我累了：

  $(".sound").click(function()
    $(".logo-image").removeClass("play");
  );

//.sound is the class of the button that's intended to block it.

虽然后一个脚本确实成功删除了“播放”类，但每次我将鼠标悬停在图像上时，声音都会继续播放。我错过了什么？声音不应该停止播放吗？

您还有其他解决方案吗？

干杯

【问题讨论】：

【参考方案1】：

问题是因为事件处理程序绑定到元素。绑定事件后删除类不会影响该绑定。要影响事件处理程序，您可以调用off()，如下所示：

$(".sound").click(function()
    $(".logo-image").off('mouseover');
);

或者，如果您想根据类切换声音功能，您可以保留当前逻辑并检查元素在mouseover 处理程序中是否仍然具有类：

$(".logo-image").mouseover(function() 
    if ($(this).hasClass('play') 
        mouseoversound.play();
    
);

$(".sound").click(function()
    $(".logo-image").toggleClass("play");
);

【讨论】：

Rory 非常感谢我现在明白为什么这两种方法都有效！不幸的是，我刚刚注意到，考虑到我在 Rails 中的应用程序的设计方式（每次单击该徽标图像时它都会重新加载页面），以这种方式关闭声音在重新加载时不会持续存在。你知道有什么方法可以坚持这样的改变吗？也许是什么东西一起禁用了浏览器的声音？不幸的是，你不能从 JS 中做到这一点。如果您想保留设置，您可以使用 localStorage 或 cookie 来保留“静音”按钮的状态好吧，不用担心，我期待会是这样！无论如何，您的回答非常有帮助。我将尝试使用 cookie 或会话中的变量来执行此操作。如果将来有人使用此答案，我将在您的第二种方法中进行一些不正确的编辑。干杯

为啥删除所有侦听器后我的 Node.js 进程不会终止？

】为啥删除所有侦听器后我的Node.js进程不会终止？【英文标题】：Whydoesn\'tmyNode.jsprocessterminateoncealllistenershavebeenremoved?为什么删除所有侦听器后我的Node.js进程不会终止？【发布时间】：2014-11-1805:10:55【问题描述】：在下面的代... 查看详情

javaweb的监听器导致服务停止运行

...可以正常运行。参考技术AJavaweb的监听器可能会导致服务停止运行，因为它可以检测到服务器上的某些变化，如文件系统变化、网络连接变化或者其他应用程序的变化，并作出相应的响应。如果监听器检测到一些不正常的情况，... 查看详情

JQuery 添加元素，包括删除侦听器

】JQuery添加元素，包括删除侦听器【英文标题】：JQueryaddingelementsincludingaremovelistener【发布时间】：2012-02-1020:33:03【问题描述】：添加元素的最佳方式是什么？删除自己的链接，到div？这几乎可以工作：functiondisplayElements(objekt)$(\... 查看详情

如何删除客户端事件侦听器？

】如何删除客户端事件侦听器？【英文标题】：HowtoremoveaClienteventlistener?【发布时间】：2022-01-1818:50:03【问题描述】：我有一个<Client>.on函数，我想停止监听这个事件，例如：bot.on(\'messageCreate\',message=>//somecode);如何... 查看详情

添加事件侦听器，在播放完声音后更改/删除类

】添加事件侦听器，在播放完声音后更改/删除类【英文标题】：Addeventlistenerthatchanges/removesclasswhensoundisdoneplaying【发布时间】：2015-09-2108:03:23【问题描述】：如何添加一个事件侦听器，该侦听器在声音文件结束时执行删除类的功... 查看详情

使用名称中的点调度 CustomEvent 不会触发 jQuery.on() 事件侦听器

】使用名称中的点调度CustomEvent不会触发jQuery.on()事件侦听器【英文标题】：DispatchingCustomEventwithdotinnamedonottriggerjQuery.on()eventlistener【发布时间】：2016-10-0317:35:06【问题描述】：我使用jQuery版本2.2.4并尝试捕获事件-不走运。有什么... 查看详情

停止位置侦听器服务 Android

】停止位置侦听器服务Android【英文标题】：StopLocationListenerServiceAndroid【发布时间】：2017-11-0509:36:16【问题描述】：我需要从位置侦听器中删除更新，我已经尝试了一些代码但无法正常工作。我从片段调用了一个服务来获取位置... 查看详情

toggleClass 不会删除“显示”类

】toggleClass不会删除“显示”类【英文标题】：thetoggleClasswillnotremovetheclassof\'showing\'【发布时间】：2018-07-1103:24:36【问题描述】：我想给我的网站一个基本的jquery汉堡菜单图标，你可以点击它，它会变成一个十字架。一切正常，... 查看详情

jquery——类的添加与删除

添加类：addClass删除类：removeClass判断类是否存在：hasClass<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><scriptsrc="jquery-1.11.1.js"></scri 查看详情

在 jQuery 中停止递归动画

】在jQuery中停止递归动画【英文标题】：StopRecursiveAnimationinjQuery【发布时间】：2012-05-0708:07:08【问题描述】：我有一个递归动画来使屏幕上的文本改变颜色。当div失去可见性时，我想要一些机制来停止这个动画。在我的实际站点... 查看详情

片段 - 全局视图变量与本地和内部类侦听器和内存泄漏

】片段-全局视图变量与本地和内部类侦听器和内存泄漏【英文标题】：Fragment-Globalviewvariablevslocalandinnerclasslistenersandmemoryleak【发布时间】：2016-03-0222:04:46【问题描述】：假设考虑以下两个不同的定义；全局变量一；ViewmainView;List... 查看详情

jquery-02.样式表属性操作/类操作动画显示隐藏滑入淡入停止动画节点操作添加对象清空节点

样式表属性操作.css　　$("div").css({‘width‘:100,‘height‘:100,‘background‘:‘red‘});　　$("div").css("background","pink");类操作　　.addClass添加类　　$("div").addClass("class");　　.removeClass删除类 $("div).removeCl 查看详情

Firebase 停止监听 onAuthStateChanged

...描述】：从版本^3.0.0开始，我很难删除身份验证状态更改侦听器。按照文档启动监听器：firebase.auth().onAuthStateChanged(function(user)//handleit);但是，我在文档中找不到查看详情

使用 Javascript/Jquery 停止 html 声音

...种声音的按钮时停止。但是，当我再次单击按钮时，声音不会停止，而是从头开始播放。我尝试了查看详情

ActivityIndicator 不会停止动画，也不会从 UICollectionViewCell 中的超级视图中删除

...r不会停止动画，也不会从UICollectionViewCell中的超级视图中删除【英文标题】：ActivityIndicatordoesn\'tstopanimatingnorremovesfromsuperviewinUICollectionViewCell【发布时间】：2012-10-1223:04:39【问题描述】：我正在尝试实现UICollectionView并显示图像。... 查看详情

确保不会多次添加相同的事件侦听器

】确保不会多次添加相同的事件侦听器【英文标题】：makesurethesameeventlistenerisnotaddedmorethanonce【发布时间】：2016-03-2409:02:59【问题描述】：我正在实现一个单例IEventDispatcher类，但遇到了一个问题，有时我将相同的事件侦听器函数... 查看详情

Socket.io 执行后删除监听器

...】：我想在套接字上创建一个监听器。然后，一旦执行了侦听器，我希望侦听器停止侦听。我用了这个：socket.ioRemovingspecificlistener但我无法弄清楚如何让听众自我毁灭。这就是我的想法：varListenEventFunc=f 查看详情

docker那些事儿：如何安全地停止删除容器？

...机来源|CSDN博客🌟前言本篇文章将会讲讲如何停止、删除容器和对容器进行资源限制。停止和删除容器🍑停止容器在工作中，有时会需要将容器暂停，例如，要为容器文件系统做一个快照时。使用dockerpause与do... 查看详情

正文