@whitesev/domutils 1.9.7 → 1.9.10

package/dist/index.system.js

@@ -3,7 +3,7 @@ System.register('DOMUtils', [], (function (exports) {
   return {
     execute: (function () {
 
-      const version = "1.9.6";
+      const version = "1.9.10";
 
       class WindowApi {
           /** 默认的配置 */
@@ -540,7 +540,6 @@ System.register('DOMUtils', [], (function (exports) {
                       "is",
                       "jquery",
                       "keydown",
-                      "keypress",
                       "keyup",
                       "last",
                       "load",
@@ -1384,7 +1383,7 @@ System.register('DOMUtils', [], (function (exports) {
                * @param startIndex
                * @param option
                */
-              function getOption(args, startIndex, option) {
+              const getOption = function (args, startIndex, option) {
                   const currentParam = args[startIndex];
                   if (typeof currentParam === "boolean") {
                       option.capture = currentParam;
@@ -1406,7 +1405,7 @@ System.register('DOMUtils', [], (function (exports) {
                       option.isComposedPath = currentParam.isComposedPath;
                   }
                   return option;
-              }
+              };
               const that = this;
               // eslint-disable-next-line prefer-rest-params
               const args = arguments;
@@ -1464,39 +1463,52 @@ System.register('DOMUtils', [], (function (exports) {
               /**
                * 如果是once，那么删除该监听和元素上的事件和监听
                */
-              const checkOptionOnceToRemoveEventListener = () => {
+              const checkOptionOnceToRemoveEventListener = ($el) => {
                   if (listenerOption.once) {
-                      that.off(element, eventType, selector, callback, option);
+                      this.off($el, eventTypeList, selector, callback, option);
                   }
               };
-              $elList.forEach((elementItem) => {
+              $elList.forEach(($elItem) => {
                   /**
                    * 事件回调
                    * @param event
                    */
                   const handlerCallBack = function (event) {
+                      let call_this = void 0;
+                      let call_event = void 0;
+                      let call_$selector = void 0;
+                      let execCallback = false;
                       if (selectorList.length) {
-                          /* 存在子元素选择器 */
+                          // 存在子元素选择器
                           // 这时候的this和target都是子元素选择器的元素
-                          let eventTarget = listenerOption.isComposedPath
-                              ? event.composedPath()[0]
-                              : event.target;
-                          let totalParent = elementItem;
-                          if (CommonUtils.isWin(totalParent)) {
-                              if (totalParent === that.windowApi.document) {
-                                  totalParent = that.windowApi.document.documentElement;
+                          let $target;
+                          if (listenerOption.isComposedPath) {
+                              // 可能为空
+                              const composedPath = event.composedPath();
+                              if (!composedPath.length && event.target) {
+                                  composedPath.push(event.target);
                               }
+                              $target = composedPath[0];
                           }
-                          const findValue = selectorList.find((selectorItem) => {
+                          else {
+                              $target = event.target;
+                          }
+                          let $parent = $elItem;
+                          if (CommonUtils.isWin($parent)) {
+                              // window和document共用一个对象
+                              // 这样就能处理子元素选择器无法匹配的问题
+                              $parent = that.windowApi.document.documentElement;
+                          }
+                          const findValue = selectorList.find((selectors) => {
                               // 判断目标元素是否匹配选择器
-                              if (that.matches(eventTarget, selectorItem)) {
-                                  /* 当前目标可以被selector所匹配到 */
+                              if (that.matches($target, selectors)) {
+                                  // 当前目标可以被selector所匹配到
                                   return true;
                               }
-                              /* 在上层与主元素之间寻找可以被selector所匹配到的 */
-                              const $closestMatches = that.closest(eventTarget, selectorItem);
-                              if ($closestMatches && totalParent?.contains?.($closestMatches)) {
-                                  eventTarget = $closestMatches;
+                              // 在上层与主元素之间寻找可以被selector所匹配到的
+                              const $closestMatches = that.closest($target, selectors);
+                              if ($closestMatches && $parent?.contains?.($closestMatches)) {
+                                  $target = $closestMatches;
                                   return true;
                               }
                               return false;
@@ -1506,29 +1518,38 @@ System.register('DOMUtils', [], (function (exports) {
                               try {
                                   OriginPrototype.Object.defineProperty(event, "target", {
                                       get() {
-                                          return eventTarget;
+                                          return $target;
                                       },
                                   });
+                                  // oxlint-disable-next-line no-empty
                               }
-                              catch {
-                                  // TODO
-                              }
-                              listenerCallBack.call(eventTarget, event, eventTarget);
-                              checkOptionOnceToRemoveEventListener();
+                              catch { }
+                              execCallback = true;
+                              call_this = $target;
+                              call_event = event;
+                              call_$selector = $target;
                           }
                       }
                       else {
-                          // 这时候的this指向监听的元素
-                          listenerCallBack.call(elementItem, event);
-                          checkOptionOnceToRemoveEventListener();
+                          execCallback = true;
+                          call_this = $elItem;
+                          call_event = event;
+                      }
+                      if (execCallback) {
+                          const result = listenerCallBack.call(call_this, call_event, call_$selector);
+                          checkOptionOnceToRemoveEventListener($elItem);
+                          if (typeof result === "boolean" && !result) {
+                              return false;
+                          }
                       }
                   };
-                  /* 遍历事件名设置元素事件 */
+                  // 遍历事件名设置元素事件
                   eventTypeList.forEach((eventName) => {
-                      elementItem.addEventListener(eventName, handlerCallBack, listenerOption);
-                      /* 获取对象上的事件 */
-                      const elementEvents = Reflect.get(elementItem, GlobalData.domEventSymbol) || {};
-                      /* 初始化对象上的xx事件 */
+                      // add listener
+                      $elItem.addEventListener(eventName, handlerCallBack, listenerOption);
+                      // 获取对象上的事件
+                      const elementEvents = Reflect.get($elItem, GlobalData.domEventSymbol) || {};
+                      // 初始化对象上的xx事件
                       elementEvents[eventName] = elementEvents[eventName] || [];
                       elementEvents[eventName].push({
                           selector: selectorList,
@@ -1536,8 +1557,8 @@ System.register('DOMUtils', [], (function (exports) {
                           handlerCallBack: handlerCallBack,
                           callback: listenerCallBack,
                       });
-                      /* 覆盖事件 */
-                      Reflect.set(elementItem, GlobalData.domEventSymbol, elementEvents);
+                      // 覆盖事件
+                      Reflect.set($elItem, GlobalData.domEventSymbol, elementEvents);
                   });
               });
               return {
@@ -1551,7 +1572,7 @@ System.register('DOMUtils', [], (function (exports) {
                   /**
                    * 主动触发事件
                    * @param extraDetails 赋予触发的Event的额外属性，如果是Event类型，那么将自动代替默认new的Event对象
-                   * @param useDispatchToTriggerEvent 是否使用dispatchEvent来触发事件，默认true，如果为false，则直接调用callback，但是这种会让使用了$selector的没有值
+                   * @param useDispatchToTriggerEvent 是否使用dispatchEvent来触发事件，默认true，如果为false，则直接调用callback，但是这种会让使用了`$selector`的没有值
                    */
                   emit: (extraDetails, useDispatchToTriggerEvent) => {
                       that.emit($elList, eventTypeList, extraDetails, useDispatchToTriggerEvent);
@@ -1565,7 +1586,7 @@ System.register('DOMUtils', [], (function (exports) {
                * @param startIndex
                * @param option
                */
-              function getOption(args1, startIndex, option) {
+              const getOption = function (args1, startIndex, option) {
                   const currentParam = args1[startIndex];
                   if (typeof currentParam === "boolean") {
                       option.capture = currentParam;
@@ -1574,7 +1595,7 @@ System.register('DOMUtils', [], (function (exports) {
                       option.capture = currentParam.capture;
                   }
                   return option;
-              }
+              };
               const that = this;
               // eslint-disable-next-line prefer-rest-params
               const args = arguments;
@@ -1627,22 +1648,12 @@ System.register('DOMUtils', [], (function (exports) {
                   // 这是存在selector的情况
                   listenerOption = getOption(args, 4, listenerOption);
               }
-              // 是否移除所有事件
-              let isRemoveAll = false;
-              if (args.length === 2) {
-                  // 目标函数、事件名
-                  isRemoveAll = true;
-              }
-              else if ((args.length === 3 && typeof args[2] === "string") || Array.isArray(args[2])) {
-                  // 目标函数、事件名、子元素选择器
-                  isRemoveAll = true;
-              }
               if (args.length === 5 && typeof args[4] === "function" && typeof filter !== "function") {
                   // 目标函数、事件名、回调函数、事件配置、过滤函数
                   filter = option;
               }
               $elList.forEach(($elItem) => {
-                  /* 获取对象上的事件 */
+                  // 获取对象上的事件
                   const elementEvents = Reflect.get($elItem, GlobalData.domEventSymbol) || {};
                   eventTypeList.forEach((eventName) => {
                       const handlers = elementEvents[eventName] || [];
@@ -1666,7 +1677,7 @@ System.register('DOMUtils', [], (function (exports) {
                               // 事件的配置项不同
                               flag = false;
                           }
-                          if (flag || isRemoveAll) {
+                          if (flag) {
                               $elItem.removeEventListener(eventName, handler.handlerCallBack, handler.option);
                               const findIndex = handlers.findIndex((item) => item === handler);
                               if (findIndex !== -1) {
@@ -1675,7 +1686,7 @@ System.register('DOMUtils', [], (function (exports) {
                           }
                       }
                       if (handlers.length === 0) {
-                          /* 如果没有任意的handler，那么删除该属性 */
+                          // 如果没有任意的handler，那么删除该属性
                           CommonUtils.delete(elementEvents, eventType);
                       }
                   });
@@ -2222,49 +2233,6 @@ System.register('DOMUtils', [], (function (exports) {
               }
               return that.on(element, "keydown", null, handler, option);
           }
-          /**
-           * 当按键按下时触发事件
-           * keydown - > keypress - > keyup
-           * @param element 目标
-           * @param handler 事件处理函数
-           * @param option 配置
-           * @example
-           * // 监听a.xx元素的按键按下
-           * DOMUtils.keypress(document.querySelector("a.xx"),()=>{
-           *   console.log("按键按下");
-           * })
-           * DOMUtils.keypress("a.xx",()=>{
-           *   console.log("按键按下");
-           * })
-           */
-          onKeypress(element, handler, option) {
-              const that = this;
-              if (element == null) {
-                  return;
-              }
-              if (typeof element === "string") {
-                  element = that.selectorAll(element);
-              }
-              if (CommonUtils.isNodeList(element)) {
-                  // 设置
-                  const listenerList = [];
-                  element.forEach(($ele) => {
-                      const listener = that.onKeypress($ele, handler, option);
-                      listenerList.push(listener);
-                  });
-                  return {
-                      off() {
-                          listenerList.forEach((listener) => {
-                              if (!listener) {
-                                  return;
-                              }
-                              listener.off();
-                          });
-                      },
-                  };
-              }
-              return that.on(element, "keypress", null, handler, option);
-          }
           /**
            * 监听某个元素键盘按键事件或window全局按键事件
            * 按下有值的键时触发，按下Ctrl\Alt\Shift\Meta是无值键。按下先触发keydown事件，再触发keypress事件。
@@ -2328,7 +2296,7 @@ System.register('DOMUtils', [], (function (exports) {
                搜索		170
                收藏		171
             **/
-          onKeyboard(element, eventName = "keypress", handler, options) {
+          onKeyboard(element, eventName = "keydown", handler, options) {
               const that = this;
               if (typeof element === "string") {
                   element = that.selectorAll(element);
@@ -2479,11 +2447,11 @@ System.register('DOMUtils', [], (function (exports) {
                * 阻止事件的默认行为发生，并阻止事件传播
                */
               const stopEvent = (event, onlyStopPropagation) => {
+                  // 停止事件的传播，阻止它继续向更上层的元素冒泡，事件将不会再传播给其他的元素
+                  event?.stopPropagation();
+                  // 阻止事件传播，并且还能阻止元素上的其他事件处理程序被触发
+                  event?.stopImmediatePropagation();
                   if (typeof onlyStopPropagation === "boolean" && onlyStopPropagation) {
-                      // 停止事件的传播，阻止它继续向更上层的元素冒泡，事件将不会再传播给其他的元素
-                      event?.stopPropagation();
-                      // 阻止事件传播，并且还能阻止元素上的其他事件处理程序被触发
-                      event?.stopImmediatePropagation();
                       return;
                   }
                   // 阻止事件的默认行为发生。例如，当点击一个链接时，浏览器会默认打开链接的URL，或者在输入框内输入文字
@@ -2506,7 +2474,8 @@ System.register('DOMUtils', [], (function (exports) {
                       eventNameList = [eventNameList];
                   }
                   let option = void 0;
-                  if (typeof args[2] === "string" || Array.isArray(args[2])) {
+                  if (args.length === 2) ;
+                  else if (typeof args[2] === "string" || Array.isArray(args[2])) {
                       // selector
                       selector = args[2];
                       if (typeof args[3] === "object" && args[3] != null) {