@whitesev/pops 4.2.1 → 4.2.2

package/dist/types/src/Pops.d.ts

@@ -181,14 +181,14 @@ declare class Pops {
             onInput($el: HTMLInputElement | HTMLTextAreaElement, callback: (evt: InputEvent) => void | Promise<void>, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): {
                 off: () => void;
             };
-            on<T extends import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: T | T[], callback: (this: HTMLElement, event: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_Event[T]) => void, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): import("./types/PopsDOMUtilsEventType").PopsDOMUtilsAddEventListenerResult;
-            on<T extends Event>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: string | string[], callback: (this: HTMLElement, event: T) => void, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): import("./types/PopsDOMUtilsEventType").PopsDOMUtilsAddEventListenerResult;
-            on<T extends import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: T | T[], selector: string | string[] | undefined | null, callback: (this: HTMLElement, event: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_Event[T], selectorTarget: HTMLElement) => void, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): import("./types/PopsDOMUtilsEventType").PopsDOMUtilsAddEventListenerResult;
-            on<T extends Event>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: string | string[], selector: string | string[] | undefined | null, callback: (this: HTMLElement, event: T, selectorTarget: HTMLElement) => void, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): import("./types/PopsDOMUtilsEventType").PopsDOMUtilsAddEventListenerResult;
-            off<T extends import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: T | T[], callback?: (<E extends HTMLElement = HTMLElement>(this: E, event: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_Event[T]) => void) | undefined, option?: EventListenerOptions | boolean, filter?: (value: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
-            off<T extends Event>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: string | string[], callback?: (<E extends HTMLElement = HTMLElement>(this: E, event: T) => void) | undefined, option?: EventListenerOptions | boolean, filter?: (value: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
-            off<T extends import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: T | T[], selector?: string | string[] | undefined | null, callback?: (<E extends HTMLElement = HTMLElement>(this: E, event: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_Event[T], $selector: E) => void) | undefined, option?: EventListenerOptions | boolean, filter?: (value: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
-            off<T extends Event>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: string | string[], selector?: string | string[] | undefined | null, callback?: (<E extends HTMLElement = HTMLElement>(this: E, event: T, $selector: E) => void) | undefined, option?: EventListenerOptions | boolean, filter?: (value: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
+            on<T extends import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType = "drag" | "click" | "scroll" | "blur" | "focus" | "search" | "input" | "resize" | "reset" | "play" | "change" | "contextmenu" | "dblclick" | "mousedown" | "mouseenter" | "mouseleave" | "mousemove" | "mouseover" | "mouseout" | "mouseup" | "hover" | "keydown" | "keypress" | "keyup" | "abort" | "beforeunload" | "error" | "hashchange" | "load" | "pageshow" | "pagehide" | "unload" | "focusin" | "focusout" | "copy" | "cut" | "paste" | "afterprint" | "beforeprint" | "dragend" | "dragenter" | "dragleave" | "dragover" | "dragstart" | "drop" | "canplay" | "canplaythrough" | "durationchange" | "emptied" | "ended" | "loadeddata" | "loadedmetadata" | "loadstart" | "pause" | "playing" | "progress" | "ratechange" | "seeked" | "seeking" | "stalled" | "suspend" | "timeupdate" | "volumechange" | "waiting" | "animationend" | "animationiteration" | "animationstart" | "transitionend" | "touchstart" | "touchmove" | "touchend" | "touchcancel" | "touchenter" | "touchleave" | "message" | "online" | "offline" | "popstate" | "show" | "storage" | "toggle" | "wheel" | "propertychange" | "fullscreenchange" | "DOMContentLoaded">(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: T | T[], callback: (this: HTMLElement, event: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_Event[T]) => void, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): import("./types/PopsDOMUtilsEventType").PopsDOMUtilsAddEventListenerResult;
+            on<T extends Event = Event>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: string | string[], callback: (this: HTMLElement, event: T) => void, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): import("./types/PopsDOMUtilsEventType").PopsDOMUtilsAddEventListenerResult;
+            on<T extends import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType = "drag" | "click" | "scroll" | "blur" | "focus" | "search" | "input" | "resize" | "reset" | "play" | "change" | "contextmenu" | "dblclick" | "mousedown" | "mouseenter" | "mouseleave" | "mousemove" | "mouseover" | "mouseout" | "mouseup" | "hover" | "keydown" | "keypress" | "keyup" | "abort" | "beforeunload" | "error" | "hashchange" | "load" | "pageshow" | "pagehide" | "unload" | "focusin" | "focusout" | "copy" | "cut" | "paste" | "afterprint" | "beforeprint" | "dragend" | "dragenter" | "dragleave" | "dragover" | "dragstart" | "drop" | "canplay" | "canplaythrough" | "durationchange" | "emptied" | "ended" | "loadeddata" | "loadedmetadata" | "loadstart" | "pause" | "playing" | "progress" | "ratechange" | "seeked" | "seeking" | "stalled" | "suspend" | "timeupdate" | "volumechange" | "waiting" | "animationend" | "animationiteration" | "animationstart" | "transitionend" | "touchstart" | "touchmove" | "touchend" | "touchcancel" | "touchenter" | "touchleave" | "message" | "online" | "offline" | "popstate" | "show" | "storage" | "toggle" | "wheel" | "propertychange" | "fullscreenchange" | "DOMContentLoaded">(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: T | T[], selector: string | string[] | undefined | null, callback: (this: HTMLElement, event: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_Event[T], selectorTarget: HTMLElement) => void, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): import("./types/PopsDOMUtilsEventType").PopsDOMUtilsAddEventListenerResult;
+            on<T extends Event = Event>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: string | string[], selector: string | string[] | undefined | null, callback: (this: HTMLElement, event: T, selectorTarget: HTMLElement) => void, option?: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOption | boolean): import("./types/PopsDOMUtilsEventType").PopsDOMUtilsAddEventListenerResult;
+            off<T extends import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType = "drag" | "click" | "scroll" | "blur" | "focus" | "search" | "input" | "resize" | "reset" | "play" | "change" | "contextmenu" | "dblclick" | "mousedown" | "mouseenter" | "mouseleave" | "mousemove" | "mouseover" | "mouseout" | "mouseup" | "hover" | "keydown" | "keypress" | "keyup" | "abort" | "beforeunload" | "error" | "hashchange" | "load" | "pageshow" | "pagehide" | "unload" | "focusin" | "focusout" | "copy" | "cut" | "paste" | "afterprint" | "beforeprint" | "dragend" | "dragenter" | "dragleave" | "dragover" | "dragstart" | "drop" | "canplay" | "canplaythrough" | "durationchange" | "emptied" | "ended" | "loadeddata" | "loadedmetadata" | "loadstart" | "pause" | "playing" | "progress" | "ratechange" | "seeked" | "seeking" | "stalled" | "suspend" | "timeupdate" | "volumechange" | "waiting" | "animationend" | "animationiteration" | "animationstart" | "transitionend" | "touchstart" | "touchmove" | "touchend" | "touchcancel" | "touchenter" | "touchleave" | "message" | "online" | "offline" | "popstate" | "show" | "storage" | "toggle" | "wheel" | "propertychange" | "fullscreenchange" | "DOMContentLoaded">(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: T | T[], callback?: (<E extends HTMLElement = HTMLElement>(this: E, event: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_Event[T]) => void) | undefined, option?: EventListenerOptions | boolean, filter?: (value: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
+            off<T extends Event = Event>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: string | string[], callback?: (<E extends HTMLElement = HTMLElement>(this: E, event: T) => void) | undefined, option?: EventListenerOptions | boolean, filter?: (value: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
+            off<T extends import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType = "drag" | "click" | "scroll" | "blur" | "focus" | "search" | "input" | "resize" | "reset" | "play" | "change" | "contextmenu" | "dblclick" | "mousedown" | "mouseenter" | "mouseleave" | "mousemove" | "mouseover" | "mouseout" | "mouseup" | "hover" | "keydown" | "keypress" | "keyup" | "abort" | "beforeunload" | "error" | "hashchange" | "load" | "pageshow" | "pagehide" | "unload" | "focusin" | "focusout" | "copy" | "cut" | "paste" | "afterprint" | "beforeprint" | "dragend" | "dragenter" | "dragleave" | "dragover" | "dragstart" | "drop" | "canplay" | "canplaythrough" | "durationchange" | "emptied" | "ended" | "loadeddata" | "loadedmetadata" | "loadstart" | "pause" | "playing" | "progress" | "ratechange" | "seeked" | "seeking" | "stalled" | "suspend" | "timeupdate" | "volumechange" | "waiting" | "animationend" | "animationiteration" | "animationstart" | "transitionend" | "touchstart" | "touchmove" | "touchend" | "touchcancel" | "touchenter" | "touchleave" | "message" | "online" | "offline" | "popstate" | "show" | "storage" | "toggle" | "wheel" | "propertychange" | "fullscreenchange" | "DOMContentLoaded">(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: T | T[], selector?: string | string[] | undefined | null, callback?: (<E extends HTMLElement = HTMLElement>(this: E, event: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_Event[T], $selector: E) => void) | undefined, option?: EventListenerOptions | boolean, filter?: (value: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
+            off<T extends Event = Event>(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType: string | string[], selector?: string | string[] | undefined | null, callback?: (<E extends HTMLElement = HTMLElement>(this: E, event: T, $selector: E) => void) | undefined, option?: EventListenerOptions | boolean, filter?: (value: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
             offAll(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType?: string): void;
             offAll(element: import("./types/PopsDOMUtilsEventType").PopsDOMUtilsElementEventType, eventType?: import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType | import("./types/PopsDOMUtilsEventType").PopsDOMUtils_EventType[]): void;
             onReady<T extends (...args: any[]) => any>(callback: T): void;

package/dist/types/src/utils/PopsDOMUtils.d.ts

@@ -1,4 +1,4 @@
-import type { ParseHTMLReturnType, PopsDOMUtils_EventType, PopsDOMUtilsCreateElementAttributesMap, PopsDOMUtilsEventListenerOption, PopsDOMUtilsEventListenerOptionsAttribute, PopsDOMUtils_Event, PopsDOMUtilsElementEventType, PopsDOMUtilsAddEventListenerResult, PopsDOMUtilsCSSProperty, PopsDOMUtilsCSSPropertyType, PopsDOMUtilsTargetElementType } from "../types/PopsDOMUtilsEventType";
+import type { ParseHTMLReturnType, PopsDOMUtils_Event, PopsDOMUtils_EventType, PopsDOMUtilsAddEventListenerResult, PopsDOMUtilsCreateElementAttributesMap, PopsDOMUtilsCSSProperty, PopsDOMUtilsCSSPropertyType, PopsDOMUtilsElementEventType, PopsDOMUtilsEventListenerOption, PopsDOMUtilsEventListenerOptionsAttribute, PopsDOMUtilsTargetElementType } from "../types/PopsDOMUtilsEventType";
 declare class PopsDOMUtilsEvent {
     /**
      * 绑定事件
@@ -18,7 +18,7 @@ declare class PopsDOMUtilsEvent {
      *    console.log("事件触发",event)
      * })
      */
-    on<T extends PopsDOMUtils_EventType>(element: PopsDOMUtilsElementEventType, eventType: T | T[], callback: (this: HTMLElement, event: PopsDOMUtils_Event[T]) => void, option?: PopsDOMUtilsEventListenerOption | boolean): PopsDOMUtilsAddEventListenerResult;
+    on<T extends PopsDOMUtils_EventType = PopsDOMUtils_EventType>(element: PopsDOMUtilsElementEventType, eventType: T | T[], callback: (this: HTMLElement, event: PopsDOMUtils_Event[T]) => void, option?: PopsDOMUtilsEventListenerOption | boolean): PopsDOMUtilsAddEventListenerResult;
     /**
      * 绑定事件
      * @param element 需要绑定的元素|元素数组|window
@@ -37,7 +37,7 @@ declare class PopsDOMUtilsEvent {
      *    console.log("事件触发",event)
      * })
      */
-    on<T extends Event>(element: PopsDOMUtilsElementEventType, eventType: string | string[], callback: (this: HTMLElement, event: T) => void, option?: PopsDOMUtilsEventListenerOption | boolean): PopsDOMUtilsAddEventListenerResult;
+    on<T extends Event = Event>(element: PopsDOMUtilsElementEventType, eventType: string | string[], callback: (this: HTMLElement, event: T) => void, option?: PopsDOMUtilsEventListenerOption | boolean): PopsDOMUtilsAddEventListenerResult;
     /**
      * 绑定事件
      * @param element 需要绑定的元素|元素数组|window
@@ -62,7 +62,7 @@ declare class PopsDOMUtilsEvent {
      *    console.log("事件触发", event, selectorTarget)
      * })
      */
-    on<T extends PopsDOMUtils_EventType>(element: PopsDOMUtilsElementEventType, eventType: T | T[], selector: string | string[] | undefined | null, callback: (this: HTMLElement, event: PopsDOMUtils_Event[T], selectorTarget: HTMLElement) => void, option?: PopsDOMUtilsEventListenerOption | boolean): PopsDOMUtilsAddEventListenerResult;
+    on<T extends PopsDOMUtils_EventType = PopsDOMUtils_EventType>(element: PopsDOMUtilsElementEventType, eventType: T | T[], selector: string | string[] | undefined | null, callback: (this: HTMLElement, event: PopsDOMUtils_Event[T], selectorTarget: HTMLElement) => void, option?: PopsDOMUtilsEventListenerOption | boolean): PopsDOMUtilsAddEventListenerResult;
     /**
      * 绑定事件
      * @param element 需要绑定的元素|元素数组|window
@@ -87,7 +87,7 @@ declare class PopsDOMUtilsEvent {
      *    console.log("事件触发", event, selectorTarget)
      * })
      */
-    on<T extends Event>(element: PopsDOMUtilsElementEventType, eventType: string | string[], selector: string | string[] | undefined | null, callback: (this: HTMLElement, event: T, selectorTarget: HTMLElement) => void, option?: PopsDOMUtilsEventListenerOption | boolean): PopsDOMUtilsAddEventListenerResult;
+    on<T extends Event = Event>(element: PopsDOMUtilsElementEventType, eventType: string | string[], selector: string | string[] | undefined | null, callback: (this: HTMLElement, event: T, selectorTarget: HTMLElement) => void, option?: PopsDOMUtilsEventListenerOption | boolean): PopsDOMUtilsAddEventListenerResult;
     /**
      * 取消绑定事件
      * @param element 需要取消绑定的元素|元素数组
@@ -101,7 +101,7 @@ declare class PopsDOMUtilsEvent {
      * DOMUtils.off(document.querySelector("a.xx"),"click")
      * DOMUtils.off("a.xx","click")
      */
-    off<T extends PopsDOMUtils_EventType>(element: PopsDOMUtilsElementEventType, eventType: T | T[], callback?: <E extends HTMLElement = HTMLElement>(this: E, event: PopsDOMUtils_Event[T]) => void, option?: EventListenerOptions | boolean, filter?: (value: PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
+    off<T extends PopsDOMUtils_EventType = PopsDOMUtils_EventType>(element: PopsDOMUtilsElementEventType, eventType: T | T[], callback?: <E extends HTMLElement = HTMLElement>(this: E, event: PopsDOMUtils_Event[T]) => void, option?: EventListenerOptions | boolean, filter?: (value: PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
     /**
      * 取消绑定事件
      * @param element 需要取消绑定的元素|元素数组
@@ -115,7 +115,7 @@ declare class PopsDOMUtilsEvent {
      * DOMUtils.off(document.querySelector("a.xx"),"click")
      * DOMUtils.off("a.xx","click")
      */
-    off<T extends Event>(element: PopsDOMUtilsElementEventType, eventType: string | string[], callback?: <E extends HTMLElement = HTMLElement>(this: E, event: T) => void, option?: EventListenerOptions | boolean, filter?: (value: PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
+    off<T extends Event = Event>(element: PopsDOMUtilsElementEventType, eventType: string | string[], callback?: <E extends HTMLElement = HTMLElement>(this: E, event: T) => void, option?: EventListenerOptions | boolean, filter?: (value: PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
     /**
      * 取消绑定事件
      * @param element 需要取消绑定的元素|元素数组
@@ -130,7 +130,7 @@ declare class PopsDOMUtilsEvent {
      * DOMUtils.off(document.querySelector("a.xx"),"click tap hover")
      * DOMUtils.off("a.xx",["click","tap","hover"])
      */
-    off<T extends PopsDOMUtils_EventType>(element: PopsDOMUtilsElementEventType, eventType: T | T[], selector?: string | string[] | undefined | null, callback?: <E extends HTMLElement = HTMLElement>(this: E, event: PopsDOMUtils_Event[T], $selector: E) => void, option?: EventListenerOptions | boolean, filter?: (value: PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
+    off<T extends PopsDOMUtils_EventType = PopsDOMUtils_EventType>(element: PopsDOMUtilsElementEventType, eventType: T | T[], selector?: string | string[] | undefined | null, callback?: <E extends HTMLElement = HTMLElement>(this: E, event: PopsDOMUtils_Event[T], $selector: E) => void, option?: EventListenerOptions | boolean, filter?: (value: PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
     /**
      * 取消绑定事件
      * @param element 需要取消绑定的元素|元素数组
@@ -145,7 +145,7 @@ declare class PopsDOMUtilsEvent {
      * DOMUtils.off(document.querySelector("a.xx"),"click tap hover")
      * DOMUtils.off("a.xx",["click","tap","hover"])
      */
-    off<T extends Event>(element: PopsDOMUtilsElementEventType, eventType: string | string[], selector?: string | string[] | undefined | null, callback?: <E extends HTMLElement = HTMLElement>(this: E, event: T, $selector: E) => void, option?: EventListenerOptions | boolean, filter?: (value: PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
+    off<T extends Event = Event>(element: PopsDOMUtilsElementEventType, eventType: string | string[], selector?: string | string[] | undefined | null, callback?: <E extends HTMLElement = HTMLElement>(this: E, event: T, $selector: E) => void, option?: EventListenerOptions | boolean, filter?: (value: PopsDOMUtilsEventListenerOptionsAttribute, index: number, array: PopsDOMUtilsEventListenerOptionsAttribute[]) => boolean): void;
     /**
      * 取消绑定所有的事件
      * @param element 需要取消绑定的元素|元素数组

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whitesev/pops",
-  "version": "4.2.1",
+  "version": "4.2.2",
   "description": "弹窗库，包含了alert、confirm、prompt、drawer、folder、loading、iframe、panel、tooltip、searchSuggestion、rightClickMenu组件",
   "keywords": [
     "ScriptCat",

package/src/utils/PopsDOMUtils.ts

@@ -1,20 +1,20 @@
+import { PopsCommonCSSClassName } from "../config/CommonCSSClassName";
+import { OriginPrototype, PopsCore } from "../PopsCore";
 import type {
   ParseHTMLReturnType,
-  PopsDOMUtils_EventType,
-  PopsDOMUtilsCreateElementAttributesMap,
-  PopsDOMUtilsEventListenerOption,
-  PopsDOMUtilsEventListenerOptionsAttribute,
   PopsDOMUtils_Event,
-  PopsDOMUtilsElementEventType,
+  PopsDOMUtils_EventType,
   PopsDOMUtilsAddEventListenerResult,
+  PopsDOMUtilsCreateElementAttributesMap,
   PopsDOMUtilsCSSProperty,
   PopsDOMUtilsCSSPropertyType,
+  PopsDOMUtilsElementEventType,
+  PopsDOMUtilsEventListenerOption,
+  PopsDOMUtilsEventListenerOptionsAttribute,
   PopsDOMUtilsTargetElementType,
 } from "../types/PopsDOMUtilsEventType";
-import { OriginPrototype, PopsCore } from "../PopsCore";
-import { popsUtils } from "./PopsUtils";
 import { PopsSafeUtils } from "./PopsSafeUtils";
-import { PopsCommonCSSClassName } from "../config/CommonCSSClassName";
+import { popsUtils } from "./PopsUtils";
 /**
  * 存储在元素属性上的事件名
  */
@@ -39,7 +39,7 @@ class PopsDOMUtilsEvent {
    *    console.log("事件触发",event)
    * })
    */
-  on<T extends PopsDOMUtils_EventType>(
+  on<T extends PopsDOMUtils_EventType = PopsDOMUtils_EventType>(
     element: PopsDOMUtilsElementEventType,
     eventType: T | T[],
     callback: (this: HTMLElement, event: PopsDOMUtils_Event[T]) => void,
@@ -63,7 +63,7 @@ class PopsDOMUtilsEvent {
    *    console.log("事件触发",event)
    * })
    */
-  on<T extends Event>(
+  on<T extends Event = Event>(
     element: PopsDOMUtilsElementEventType,
     eventType: string | string[],
     callback: (this: HTMLElement, event: T) => void,
@@ -93,7 +93,7 @@ class PopsDOMUtilsEvent {
    *    console.log("事件触发", event, selectorTarget)
    * })
    */
-  on<T extends PopsDOMUtils_EventType>(
+  on<T extends PopsDOMUtils_EventType = PopsDOMUtils_EventType>(
     element: PopsDOMUtilsElementEventType,
     eventType: T | T[],
     selector: string | string[] | undefined | null,
@@ -124,14 +124,14 @@ class PopsDOMUtilsEvent {
    *    console.log("事件触发", event, selectorTarget)
    * })
    */
-  on<T extends Event>(
+  on<T extends Event = Event>(
     element: PopsDOMUtilsElementEventType,
     eventType: string | string[],
     selector: string | string[] | undefined | null,
     callback: (this: HTMLElement, event: T, selectorTarget: HTMLElement) => void,
     option?: PopsDOMUtilsEventListenerOption | boolean
   ): PopsDOMUtilsAddEventListenerResult;
-  on<T extends Event>(
+  on<T extends Event = Event>(
     element: HTMLElement | string | NodeList | HTMLElement[] | Window | Document | Element | null | typeof globalThis,
     eventType: PopsDOMUtils_EventType | PopsDOMUtils_EventType[] | string | string[],
     selector:
@@ -231,89 +231,88 @@ class PopsDOMUtilsEvent {
       // 这是存在selector的情况
       listenerOption = getOption(args, 4, listenerOption);
     }
-    /**
-     * 如果是once，那么删除该监听和元素上的事件和监听
-     */
-    const checkOptionOnceToRemoveEventListener = ($el: PopsDOMUtilsElementEventType) => {
-      if (listenerOption.once) {
-        this.off($el, eventTypeList, selector as any, callback as any, option);
-      }
-    };
     $elList.forEach(($elItem) => {
-      /**
-       * 事件回调
-       * @param event
-       */
-      const handlerCallBack = function (event: Event) {
-        let call_this: Element | undefined = void 0;
-        let call_event: Event | undefined = void 0;
-        let call_$selector: HTMLElement | undefined = void 0;
-        let execCallback = false;
-        if (selectorList.length) {
-          // 存在子元素选择器
-          // 这时候的this和target都是子元素选择器的元素
-          let $target: HTMLElement;
-          if (listenerOption.isComposedPath) {
-            // 可能为空
-            const composedPath = event.composedPath();
-            if (!composedPath.length && event.target) {
-              composedPath.push(event.target);
-            }
-            $target = composedPath[0] as HTMLElement;
-          } else {
-            $target = event.target as HTMLElement;
-          }
-          let $parent = $elItem;
-          if (popsUtils.isWin($parent)) {
-            // window和document共用一个对象
-            // 这样就能处理子元素选择器无法匹配的问题
-            $parent = PopsCore.document.documentElement;
+      // 遍历事件名设置元素事件
+      eventTypeList.forEach((eventName) => {
+        /**
+         * 如果是option.once，那么删除该监听和元素上的事件和监听
+         */
+        const checkOptionOnceToRemoveEventListener = () => {
+          if (listenerOption.once) {
+            this.off($elItem, eventName, selector as any, callback as any, option);
           }
-          const findValue = selectorList.find((selectors) => {
-            // 判断目标元素是否匹配选择器
-            if (that.matches($target, selectors)) {
-              // 当前目标可以被selector所匹配到
-              return true;
+        };
+        /**
+         * 事件回调
+         * @param event
+         */
+        const handlerCallBack = function (event: Event) {
+          let call_this: Element | undefined = void 0;
+          let call_event: Event | undefined = void 0;
+          let call_$selector: HTMLElement | undefined = void 0;
+          let execCallback = false;
+          if (selectorList.length) {
+            // 存在子元素选择器
+            // 这时候的this和target都是子元素选择器的元素
+            let $target: HTMLElement;
+            if (listenerOption.isComposedPath) {
+              // 可能为空
+              const composedPath = event.composedPath();
+              if (!composedPath.length && event.target) {
+                composedPath.push(event.target);
+              }
+              $target = composedPath[0] as HTMLElement;
+            } else {
+              $target = event.target as HTMLElement;
             }
-            // 在上层与主元素之间寻找可以被selector所匹配到的
-            const $closestMatches = that.closest<HTMLElement>($target, selectors);
-            if ($closestMatches && (<HTMLElement>$parent)?.contains?.($closestMatches)) {
-              $target = $closestMatches;
-              return true;
+            let $parent = $elItem;
+            if (popsUtils.isWin($parent)) {
+              // window和document共用一个对象
+              // 这样就能处理子元素选择器无法匹配的问题
+              $parent = PopsCore.document.documentElement;
             }
-            return false;
-          });
-          if (findValue) {
-            // 这里尝试使用defineProperty修改event的target值
-            try {
-              OriginPrototype.Object.defineProperty(event, "target", {
-                get() {
-                  return $target;
-                },
-              });
-              // oxlint-disable-next-line no-empty
-            } catch {}
+            const findValue = selectorList.find((selectors) => {
+              // 判断目标元素是否匹配选择器
+              if (that.matches($target, selectors)) {
+                // 当前目标可以被selector所匹配到
+                return true;
+              }
+              // 在上层与主元素之间寻找可以被selector所匹配到的
+              const $closestMatches = that.closest<HTMLElement>($target, selectors);
+              if ($closestMatches && (<HTMLElement>$parent)?.contains?.($closestMatches)) {
+                $target = $closestMatches;
+                return true;
+              }
+              return false;
+            });
+            if (findValue) {
+              // 这里尝试使用defineProperty修改event的target值
+              try {
+                OriginPrototype.Object.defineProperty(event, "target", {
+                  get() {
+                    return $target;
+                  },
+                });
+                // oxlint-disable-next-line no-empty
+              } catch {}
+              execCallback = true;
+              call_this = $target;
+              call_event = event;
+              call_$selector = $target;
+            }
+          } else {
             execCallback = true;
-            call_this = $target;
+            call_this = $elItem as Element;
             call_event = event;
-            call_$selector = $target;
           }
-        } else {
-          execCallback = true;
-          call_this = $elItem as Element;
-          call_event = event;
-        }
-        if (execCallback) {
-          const result = listenerCallBack.call(call_this!, call_event!, call_$selector!);
-          checkOptionOnceToRemoveEventListener($elItem);
-          if (typeof result === "boolean" && !result) {
-            return false;
+          if (execCallback) {
+            const result = listenerCallBack.call(call_this!, call_event!, call_$selector!);
+            checkOptionOnceToRemoveEventListener();
+            if (typeof result === "boolean" && !result) {
+              return false;
+            }
           }
-        }
-      };
-
-      // 遍历事件名设置元素事件
-      eventTypeList.forEach((eventName) => {
+        };
         // add listener
         $elItem.addEventListener(eventName, handlerCallBack, listenerOption);
         // 获取对象上的事件
@@ -370,7 +369,7 @@ class PopsDOMUtilsEvent {
    * DOMUtils.off(document.querySelector("a.xx"),"click")
    * DOMUtils.off("a.xx","click")
    */
-  off<T extends PopsDOMUtils_EventType>(
+  off<T extends PopsDOMUtils_EventType = PopsDOMUtils_EventType>(
     element: PopsDOMUtilsElementEventType,
     eventType: T | T[],
     callback?: <E extends HTMLElement = HTMLElement>(this: E, event: PopsDOMUtils_Event[T]) => void,
@@ -394,7 +393,7 @@ class PopsDOMUtilsEvent {
    * DOMUtils.off(document.querySelector("a.xx"),"click")
    * DOMUtils.off("a.xx","click")
    */
-  off<T extends Event>(
+  off<T extends Event = Event>(
     element: PopsDOMUtilsElementEventType,
     eventType: string | string[],
     callback?: <E extends HTMLElement = HTMLElement>(this: E, event: T) => void,
@@ -419,7 +418,7 @@ class PopsDOMUtilsEvent {
    * DOMUtils.off(document.querySelector("a.xx"),"click tap hover")
    * DOMUtils.off("a.xx",["click","tap","hover"])
    */
-  off<T extends PopsDOMUtils_EventType>(
+  off<T extends PopsDOMUtils_EventType = PopsDOMUtils_EventType>(
     element: PopsDOMUtilsElementEventType,
     eventType: T | T[],
     selector?: string | string[] | undefined | null,
@@ -445,7 +444,7 @@ class PopsDOMUtilsEvent {
    * DOMUtils.off(document.querySelector("a.xx"),"click tap hover")
    * DOMUtils.off("a.xx",["click","tap","hover"])
    */
-  off<T extends Event>(
+  off<T extends Event = Event>(
     element: PopsDOMUtilsElementEventType,
     eventType: string | string[],
     selector?: string | string[] | undefined | null,
@@ -563,17 +562,20 @@ class PopsDOMUtilsEvent {
       } = Reflect.get($elItem, SymbolEvents) || {};
       eventTypeList.forEach((eventName) => {
         const handlers = elementEvents[eventName] || [];
-        const filterHandler = typeof filter === "function" ? handlers.filter(filter) : handlers;
-        for (let index = 0; index < filterHandler.length; index++) {
-          const handler = filterHandler[index];
+        // 过滤出需要删除的事件
+        const handlersFiltered = typeof filter === "function" ? handlers.filter(filter) : handlers;
+        for (let index = 0; index < handlersFiltered.length; index++) {
+          const handler = handlersFiltered[index];
+          // 过滤出的事件再根据下面的条件进行判断处理移除
+          // 1. callback内存地址必须相同
+          // 2. selector必须相同
+          // 3. option.capture必须相同
           let flag = true;
           if (flag && listenerCallBack && handler.callback !== listenerCallBack) {
-            // callback不同
             flag = false;
           }
           if (flag && selectorList.length && Array.isArray(handler.selector)) {
             if (JSON.stringify(handler.selector) !== JSON.stringify(selectorList)) {
-              // 子元素选择器不同
               flag = false;
             }
           }
@@ -582,14 +584,14 @@ class PopsDOMUtilsEvent {
             typeof handler.option.capture === "boolean" &&
             listenerOption.capture !== handler.option.capture
           ) {
-            // 事件的配置项不同
             flag = false;
           }
           if (flag) {
             $elItem.removeEventListener(eventName, handler.handlerCallBack, handler.option);
-            const findIndex = handlers.findIndex((item) => item === handler);
-            if (findIndex !== -1) {
-              handlers.splice(findIndex, 1);
+            for (let i = handlers.length - 1; i >= 0; i--) {
+              if (handlers[i] === handler) {
+                handlers.splice(i, 1);
+              }
             }
           }
         }