Jquery On 事件绑定多次触发问题

今天在做一个声音播放的项目,是属于一个SPA(单页面)应用。

所遇到的现象如下:

1、第一次打开页面正常可以点击正常播放。
2、第二次打开页面点击无法正常播放。
3、第三次打开页面正常可以点击播放。
4、第四次打开页面点击无法正常播放。
….

发现奇数次数可以播放,偶数次数无法播放。

思考了一会,感觉像是开了接着关。

看了一下代码发现:

、、、

 $(".reader-book-voice .switch").on('click',function () {
          var that = $(this)
          var audiolist;

          if (that.hasClass('listening')) {
            that.removeClass('listening');
            globalAudio[0].pause();
          } else {
            audiolist = plan.recommend.audios;
            that.addClass('listening');
            playMedia(audiolist,function () {
              that.removeClass('listening')
            })
          }

、、、

怀疑 on事件多次循环触发造成的。把代码改成下面:

     $(".reader-book-voice .switch").off('click').on('click',function () {
              var that = $(this)
              var audiolist;

              if (that.hasClass('listening')) {
                that.removeClass('listening');
                globalAudio[0].pause();
              } else {
                audiolist = plan.recommend.audios;
                that.addClass('listening');
                playMedia(audiolist,function () {
                  that.removeClass('listening')
                })
              }


先把之前的click事件取消绑定,然后再进行绑定,这个问题解决了。

参考链接:https://www.cnblogs.com/xiaobaimsy/p/5808269.html

本文已经被查看392次

发表评论

电子邮件地址不会被公开。 必填项已用*标注