@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.
- package/dist/index.amd.js +68 -46
- package/dist/index.amd.js.map +1 -1
- package/dist/index.amd.min.js +1 -1
- package/dist/index.amd.min.js.map +1 -1
- package/dist/index.cjs.js +68 -46
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.cjs.min.js +1 -1
- package/dist/index.cjs.min.js.map +1 -1
- package/dist/index.esm.js +68 -46
- package/dist/index.esm.js.map +1 -1
- package/dist/index.esm.min.js +1 -1
- package/dist/index.esm.min.js.map +1 -1
- package/dist/index.iife.js +68 -46
- package/dist/index.iife.js.map +1 -1
- package/dist/index.iife.min.js +1 -1
- package/dist/index.iife.min.js.map +1 -1
- package/dist/index.system.js +68 -46
- package/dist/index.system.js.map +1 -1
- package/dist/index.system.min.js +1 -1
- package/dist/index.system.min.js.map +1 -1
- package/dist/index.umd.js +68 -46
- package/dist/index.umd.js.map +1 -1
- package/dist/index.umd.min.js +1 -1
- package/dist/index.umd.min.js.map +1 -1
- package/dist/types/src/ElementEvent.d.ts +2 -2
- package/dist/types/src/types/DOMUtilsEvent.d.ts +1 -0
- package/package.json +1 -1
- package/src/ElementEvent.ts +74 -49
- package/src/types/DOMUtilsEvent.d.ts +1 -0
package/dist/index.system.js
CHANGED
|
@@ -3,7 +3,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
3
3
|
return {
|
|
4
4
|
execute: (function () {
|
|
5
5
|
|
|
6
|
-
const version = "1.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
|
|
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
|
-
|
|
1468
|
+
this.off($el, eventTypeList, selector, callback, option);
|
|
1469
1469
|
}
|
|
1470
1470
|
};
|
|
1471
|
-
$elList.forEach((
|
|
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
|
|
1481
|
-
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
|
|
1485
|
-
|
|
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((
|
|
1502
|
+
const findValue = selectorList.find((selectors) => {
|
|
1490
1503
|
// 判断目标元素是否匹配选择器
|
|
1491
|
-
if (that.matches(
|
|
1492
|
-
|
|
1504
|
+
if (that.matches($target, selectors)) {
|
|
1505
|
+
// 当前目标可以被selector所匹配到
|
|
1493
1506
|
return true;
|
|
1494
1507
|
}
|
|
1495
|
-
|
|
1496
|
-
const $closestMatches = that.closest(
|
|
1497
|
-
if ($closestMatches &&
|
|
1498
|
-
|
|
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
|
|
1521
|
+
return $target;
|
|
1509
1522
|
},
|
|
1510
1523
|
});
|
|
1524
|
+
// oxlint-disable-next-line no-empty
|
|
1511
1525
|
}
|
|
1512
|
-
catch {
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
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
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
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
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1530
|
-
|
|
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(
|
|
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
|
|
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
|
|
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
|
-
|
|
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,或者在输入框内输入文字
|