@whitesev/domutils 1.9.9 → 1.9.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,7 +3,7 @@ System.register('DOMUtils', [], (function (exports) {
3
3
  return {
4
4
  execute: (function () {
5
5
 
6
- const version = "1.9.9";
6
+ const version = "1.9.10";
7
7
 
8
8
  class WindowApi {
9
9
  /** 默认的配置 */
@@ -1383,7 +1383,7 @@ System.register('DOMUtils', [], (function (exports) {
1383
1383
  * @param startIndex
1384
1384
  * @param option
1385
1385
  */
1386
- function getOption(args, startIndex, option) {
1386
+ const getOption = function (args, startIndex, option) {
1387
1387
  const currentParam = args[startIndex];
1388
1388
  if (typeof currentParam === "boolean") {
1389
1389
  option.capture = currentParam;
@@ -1405,7 +1405,7 @@ System.register('DOMUtils', [], (function (exports) {
1405
1405
  option.isComposedPath = currentParam.isComposedPath;
1406
1406
  }
1407
1407
  return option;
1408
- }
1408
+ };
1409
1409
  const that = this;
1410
1410
  // eslint-disable-next-line prefer-rest-params
1411
1411
  const args = arguments;
@@ -1463,39 +1463,52 @@ System.register('DOMUtils', [], (function (exports) {
1463
1463
  /**
1464
1464
  * 如果是once,那么删除该监听和元素上的事件和监听
1465
1465
  */
1466
- const checkOptionOnceToRemoveEventListener = () => {
1466
+ const checkOptionOnceToRemoveEventListener = ($el) => {
1467
1467
  if (listenerOption.once) {
1468
- that.off(element, eventType, selector, callback, option);
1468
+ this.off($el, eventTypeList, selector, callback, option);
1469
1469
  }
1470
1470
  };
1471
- $elList.forEach((elementItem) => {
1471
+ $elList.forEach(($elItem) => {
1472
1472
  /**
1473
1473
  * 事件回调
1474
1474
  * @param event
1475
1475
  */
1476
1476
  const handlerCallBack = function (event) {
1477
+ let call_this = void 0;
1478
+ let call_event = void 0;
1479
+ let call_$selector = void 0;
1480
+ let execCallback = false;
1477
1481
  if (selectorList.length) {
1478
- /* 存在子元素选择器 */
1482
+ // 存在子元素选择器
1479
1483
  // 这时候的this和target都是子元素选择器的元素
1480
- let eventTarget = listenerOption.isComposedPath
1481
- ? event.composedPath()[0]
1482
- : event.target;
1483
- let totalParent = elementItem;
1484
- if (CommonUtils.isWin(totalParent)) {
1485
- if (totalParent === that.windowApi.document) {
1486
- totalParent = that.windowApi.document.documentElement;
1484
+ let $target;
1485
+ if (listenerOption.isComposedPath) {
1486
+ // 可能为空
1487
+ const composedPath = event.composedPath();
1488
+ if (!composedPath.length && event.target) {
1489
+ composedPath.push(event.target);
1487
1490
  }
1491
+ $target = composedPath[0];
1492
+ }
1493
+ else {
1494
+ $target = event.target;
1495
+ }
1496
+ let $parent = $elItem;
1497
+ if (CommonUtils.isWin($parent)) {
1498
+ // window和document共用一个对象
1499
+ // 这样就能处理子元素选择器无法匹配的问题
1500
+ $parent = that.windowApi.document.documentElement;
1488
1501
  }
1489
- const findValue = selectorList.find((selectorItem) => {
1502
+ const findValue = selectorList.find((selectors) => {
1490
1503
  // 判断目标元素是否匹配选择器
1491
- if (that.matches(eventTarget, selectorItem)) {
1492
- /* 当前目标可以被selector所匹配到 */
1504
+ if (that.matches($target, selectors)) {
1505
+ // 当前目标可以被selector所匹配到
1493
1506
  return true;
1494
1507
  }
1495
- /* 在上层与主元素之间寻找可以被selector所匹配到的 */
1496
- const $closestMatches = that.closest(eventTarget, selectorItem);
1497
- if ($closestMatches && totalParent?.contains?.($closestMatches)) {
1498
- eventTarget = $closestMatches;
1508
+ // 在上层与主元素之间寻找可以被selector所匹配到的
1509
+ const $closestMatches = that.closest($target, selectors);
1510
+ if ($closestMatches && $parent?.contains?.($closestMatches)) {
1511
+ $target = $closestMatches;
1499
1512
  return true;
1500
1513
  }
1501
1514
  return false;
@@ -1505,29 +1518,38 @@ System.register('DOMUtils', [], (function (exports) {
1505
1518
  try {
1506
1519
  OriginPrototype.Object.defineProperty(event, "target", {
1507
1520
  get() {
1508
- return eventTarget;
1521
+ return $target;
1509
1522
  },
1510
1523
  });
1524
+ // oxlint-disable-next-line no-empty
1511
1525
  }
1512
- catch {
1513
- // TODO
1514
- }
1515
- listenerCallBack.call(eventTarget, event, eventTarget);
1516
- checkOptionOnceToRemoveEventListener();
1526
+ catch { }
1527
+ execCallback = true;
1528
+ call_this = $target;
1529
+ call_event = event;
1530
+ call_$selector = $target;
1517
1531
  }
1518
1532
  }
1519
1533
  else {
1520
- // 这时候的this指向监听的元素
1521
- listenerCallBack.call(elementItem, event);
1522
- checkOptionOnceToRemoveEventListener();
1534
+ execCallback = true;
1535
+ call_this = $elItem;
1536
+ call_event = event;
1537
+ }
1538
+ if (execCallback) {
1539
+ const result = listenerCallBack.call(call_this, call_event, call_$selector);
1540
+ checkOptionOnceToRemoveEventListener($elItem);
1541
+ if (typeof result === "boolean" && !result) {
1542
+ return false;
1543
+ }
1523
1544
  }
1524
1545
  };
1525
- /* 遍历事件名设置元素事件 */
1546
+ // 遍历事件名设置元素事件
1526
1547
  eventTypeList.forEach((eventName) => {
1527
- elementItem.addEventListener(eventName, handlerCallBack, listenerOption);
1528
- /* 获取对象上的事件 */
1529
- const elementEvents = Reflect.get(elementItem, GlobalData.domEventSymbol) || {};
1530
- /* 初始化对象上的xx事件 */
1548
+ // add listener
1549
+ $elItem.addEventListener(eventName, handlerCallBack, listenerOption);
1550
+ // 获取对象上的事件
1551
+ const elementEvents = Reflect.get($elItem, GlobalData.domEventSymbol) || {};
1552
+ // 初始化对象上的xx事件
1531
1553
  elementEvents[eventName] = elementEvents[eventName] || [];
1532
1554
  elementEvents[eventName].push({
1533
1555
  selector: selectorList,
@@ -1535,8 +1557,8 @@ System.register('DOMUtils', [], (function (exports) {
1535
1557
  handlerCallBack: handlerCallBack,
1536
1558
  callback: listenerCallBack,
1537
1559
  });
1538
- /* 覆盖事件 */
1539
- Reflect.set(elementItem, GlobalData.domEventSymbol, elementEvents);
1560
+ // 覆盖事件
1561
+ Reflect.set($elItem, GlobalData.domEventSymbol, elementEvents);
1540
1562
  });
1541
1563
  });
1542
1564
  return {
@@ -1550,7 +1572,7 @@ System.register('DOMUtils', [], (function (exports) {
1550
1572
  /**
1551
1573
  * 主动触发事件
1552
1574
  * @param extraDetails 赋予触发的Event的额外属性,如果是Event类型,那么将自动代替默认new的Event对象
1553
- * @param useDispatchToTriggerEvent 是否使用dispatchEvent来触发事件,默认true,如果为false,则直接调用callback,但是这种会让使用了$selector的没有值
1575
+ * @param useDispatchToTriggerEvent 是否使用dispatchEvent来触发事件,默认true,如果为false,则直接调用callback,但是这种会让使用了`$selector`的没有值
1554
1576
  */
1555
1577
  emit: (extraDetails, useDispatchToTriggerEvent) => {
1556
1578
  that.emit($elList, eventTypeList, extraDetails, useDispatchToTriggerEvent);
@@ -1564,7 +1586,7 @@ System.register('DOMUtils', [], (function (exports) {
1564
1586
  * @param startIndex
1565
1587
  * @param option
1566
1588
  */
1567
- function getOption(args1, startIndex, option) {
1589
+ const getOption = function (args1, startIndex, option) {
1568
1590
  const currentParam = args1[startIndex];
1569
1591
  if (typeof currentParam === "boolean") {
1570
1592
  option.capture = currentParam;
@@ -1573,7 +1595,7 @@ System.register('DOMUtils', [], (function (exports) {
1573
1595
  option.capture = currentParam.capture;
1574
1596
  }
1575
1597
  return option;
1576
- }
1598
+ };
1577
1599
  const that = this;
1578
1600
  // eslint-disable-next-line prefer-rest-params
1579
1601
  const args = arguments;
@@ -1631,7 +1653,7 @@ System.register('DOMUtils', [], (function (exports) {
1631
1653
  filter = option;
1632
1654
  }
1633
1655
  $elList.forEach(($elItem) => {
1634
- /* 获取对象上的事件 */
1656
+ // 获取对象上的事件
1635
1657
  const elementEvents = Reflect.get($elItem, GlobalData.domEventSymbol) || {};
1636
1658
  eventTypeList.forEach((eventName) => {
1637
1659
  const handlers = elementEvents[eventName] || [];
@@ -1664,7 +1686,7 @@ System.register('DOMUtils', [], (function (exports) {
1664
1686
  }
1665
1687
  }
1666
1688
  if (handlers.length === 0) {
1667
- /* 如果没有任意的handler,那么删除该属性 */
1689
+ // 如果没有任意的handler,那么删除该属性
1668
1690
  CommonUtils.delete(elementEvents, eventType);
1669
1691
  }
1670
1692
  });
@@ -2425,11 +2447,11 @@ System.register('DOMUtils', [], (function (exports) {
2425
2447
  * 阻止事件的默认行为发生,并阻止事件传播
2426
2448
  */
2427
2449
  const stopEvent = (event, onlyStopPropagation) => {
2450
+ // 停止事件的传播,阻止它继续向更上层的元素冒泡,事件将不会再传播给其他的元素
2451
+ event?.stopPropagation();
2452
+ // 阻止事件传播,并且还能阻止元素上的其他事件处理程序被触发
2453
+ event?.stopImmediatePropagation();
2428
2454
  if (typeof onlyStopPropagation === "boolean" && onlyStopPropagation) {
2429
- // 停止事件的传播,阻止它继续向更上层的元素冒泡,事件将不会再传播给其他的元素
2430
- event?.stopPropagation();
2431
- // 阻止事件传播,并且还能阻止元素上的其他事件处理程序被触发
2432
- event?.stopImmediatePropagation();
2433
2455
  return;
2434
2456
  }
2435
2457
  // 阻止事件的默认行为发生。例如,当点击一个链接时,浏览器会默认打开链接的URL,或者在输入框内输入文字