vue项目中 layer.open绑定Enter事件,并解决无限

2024-05-27  本文已影响0人  麦田_426

需求

项目改为vue 但是并不是前后端完全分离的。
所以弹窗还是使用之前的layer,其中弹窗的确定和取消按钮是自己写的,不是layer自带的。 所以在进行绑定Enter键的时候比较费劲
记下来解决方法。

layer.open({
                    type: 1,
                    title: '',
                    area: ‘’ ,
                    content: ‘’,
                    success: (layero, index)=> {
                      /*enter 键确定 start*/
                      setTimeout(() => {
                          document.activeElement.blur(); //释放焦点
                      });
                      this.enterConfrim = (event) => {
                        if(event.keyCode === 13){
                          this.btnsure_com(this.formDataCm);
                          //document.removeEventListener('keydown', this.enterConfrim); //如果只想调用一次就别注销
                          return false;
                        }
                      }
                      document.addEventListener('keydown', this.enterConfrim);
                      /**/
                    },
                    end: ()=> {
                      document.removeEventListener('keydown', this.enterConfrim);
                    }
                });

其中释放焦点,会解决一直按Enter键无限弹出的问题。

上一篇 下一篇

猜你喜欢

热点阅读