@ajaxjs/util 1.1.1 → 1.1.2

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.
Files changed (80) hide show
  1. package/README.md +55 -6
  2. package/dist/index.esm.js +525 -0
  3. package/dist/index.umd.js +536 -0
  4. package/dist/{util → src/core}/cookies.d.ts +18 -18
  5. package/dist/{util → src/core}/dom.d.ts +17 -17
  6. package/dist/{util → src/core}/utils.d.ts +51 -51
  7. package/dist/{util → src/core}/xhr-config.d.ts +22 -22
  8. package/dist/{util → src/core}/xhr.d.ts +71 -71
  9. package/dist/src/index.d.ts +5 -0
  10. package/package.json +39 -43
  11. package/{dist/util/cookies.js → src/core/cookies.ts} +15 -18
  12. package/{dist/util/dom.js → src/core/dom.ts} +17 -14
  13. package/{dist/util/utils.js → src/core/utils.ts} +82 -77
  14. package/src/core/xhr-config.ts +25 -0
  15. package/{dist/util/xhr.js → src/core/xhr.ts} +128 -94
  16. package/src/index.ts +6 -0
  17. package/LICENSE +0 -201
  18. package/dist/index.d.ts +0 -38
  19. package/dist/index.js +0 -71
  20. package/dist/index.js.map +0 -1
  21. package/dist/main.d.ts +0 -1
  22. package/dist/main.js +0 -16
  23. package/dist/main.js.map +0 -1
  24. package/dist/router/index.d.ts +0 -3
  25. package/dist/router/index.js +0 -44
  26. package/dist/router/index.js.map +0 -1
  27. package/dist/router.d.ts +0 -3
  28. package/dist/router.js +0 -44
  29. package/dist/router.js.map +0 -1
  30. package/dist/shims-vue.d.ts +0 -4
  31. package/dist/style/common-functions.less +0 -294
  32. package/dist/style/reset.less +0 -19
  33. package/dist/util/cookies.js.map +0 -1
  34. package/dist/util/dom.js.map +0 -1
  35. package/dist/util/utils.js.map +0 -1
  36. package/dist/util/xhr-config.js +0 -3
  37. package/dist/util/xhr-config.js.map +0 -1
  38. package/dist/util/xhr.js.map +0 -1
  39. package/dist/widget/AccordionMenu.vue +0 -140
  40. package/dist/widget/AdjustFontSize.vue +0 -65
  41. package/dist/widget/Article.vue +0 -59
  42. package/dist/widget/EmptyContent.d.ts +0 -5
  43. package/dist/widget/EmptyContent.js +0 -7
  44. package/dist/widget/EmptyContent.js.map +0 -1
  45. package/dist/widget/Expander.vue +0 -65
  46. package/dist/widget/FileUploader/FileUploader.d.ts +0 -70
  47. package/dist/widget/FileUploader/FileUploader.js +0 -139
  48. package/dist/widget/FileUploader/FileUploader.js.map +0 -1
  49. package/dist/widget/FileUploader/FileUploader.less +0 -68
  50. package/dist/widget/FileUploader/FileUploader.ts +0 -156
  51. package/dist/widget/FileUploader/FileUploader.vue +0 -43
  52. package/dist/widget/HtmlEditor/HtmlEditor.d.ts +0 -70
  53. package/dist/widget/HtmlEditor/HtmlEditor.js +0 -287
  54. package/dist/widget/HtmlEditor/HtmlEditor.js.map +0 -1
  55. package/dist/widget/HtmlEditor/HtmlEditor.less +0 -345
  56. package/dist/widget/HtmlEditor/HtmlEditor.ts +0 -339
  57. package/dist/widget/HtmlEditor/HtmlEditor.vue +0 -70
  58. package/dist/widget/HtmlEditor/html-editor-HtmlSanitizer.js +0 -103
  59. package/dist/widget/ImageEnlarger.vue +0 -105
  60. package/dist/widget/OpacityBanner.vue +0 -125
  61. package/dist/widget/ProcessLine.vue +0 -133
  62. package/dist/widget/Resize.d.ts +0 -51
  63. package/dist/widget/Resize.js +0 -133
  64. package/dist/widget/Resize.js.map +0 -1
  65. package/dist/widget/Resize.ts +0 -152
  66. package/dist/widget/Resize.vue +0 -104
  67. package/dist/widget/TreeSelector.vue +0 -4
  68. package/dist/widget/calendar/BetweenDate.vue +0 -63
  69. package/dist/widget/calendar/Calendar.d.ts +0 -55
  70. package/dist/widget/calendar/Calendar.js +0 -145
  71. package/dist/widget/calendar/Calendar.js.map +0 -1
  72. package/dist/widget/calendar/Calendar.less +0 -210
  73. package/dist/widget/calendar/Calendar.ts +0 -167
  74. package/dist/widget/calendar/Calendar.vue +0 -52
  75. package/dist/widget/calendar/CalendarInput.vue +0 -71
  76. package/dist/widget/form/validator.d.ts +0 -70
  77. package/dist/widget/form/validator.js +0 -220
  78. package/dist/widget/form/validator.js.map +0 -1
  79. package/dist/widget/form/validator.ts +0 -289
  80. package/dist/widget/play-ground/sku.vue +0 -93
@@ -1,71 +0,0 @@
1
- <template>
2
- <div class="aj-form-calendar-input" :class="{'show-time': showTime}" @mouseover="onMouseOver">
3
- <div class="icon fa fa-calendar"></div>
4
- <input :placeholder="placeholder" size="12" :name="fieldName" :value="date + (dateOnly ? '' : ' ' + time)" type="text" autocomplete="off" />
5
- <aj-form-calendar ref="calendar" :show-time="showTime" @pick-date="recEvent" @pick-time="recTimeEvent">
6
- </aj-form-calendar>
7
- </div>
8
- </template>
9
-
10
- <script lang="ts">
11
- /**
12
- * 帶有 input 輸入框的
13
- */
14
- export default {
15
- data() {
16
- return {
17
- date: this.fieldValue,
18
- time: "",
19
- };
20
- },
21
- props: {
22
- fieldName: { type: String, required: true }, // 表单 name,字段名
23
- fieldValue: { type: String, required: false, default: "" },
24
- dateOnly: { type: Boolean, required: false, default: true }, // 是否只处理日期,不考虑时间
25
- showTime: { type: Boolean, required: false, default: false },
26
- positionFixed: Boolean, // 是否采用固定定位
27
- placeholder: { type: String, default: "请输入日期" }, // 提示文字
28
- },
29
- watch: {
30
- fieldValue( n: string): void {
31
- this.date = n;
32
- },
33
- },
34
- mounted(): void {
35
- if (this.positionFixed) {
36
- let el: HTMLElement = <HTMLElement>this.$el.$(".aj-form-calendar");
37
- el.classList.add("positionFixed");
38
- }
39
-
40
- // 2012-07-08
41
- // firefox中解析 new Date('2012/12-23') 不兼容,提示invalid date 无效的日期
42
- // Chrome下可以直接将其格式化成日期格式,且时分秒默认为零
43
- // var arr = date.split('-'), now = new Date(arr[0], arr[1] - 1, arr[2],
44
- // " ", "", " ");
45
- if (this.fieldValue) {
46
- let arr: string = this.fieldValue.split(" ")[0],
47
- _arr = arr.split("-");
48
- // @ts-ignore
49
- this.$refs.calendar.date = new Date(arr[0],arr[1] - 1, arr[2]," ", "", " ");
50
- }
51
- },
52
- methods: {
53
- recTimeEvent(time: string): void {
54
- this.time = time;
55
- },
56
- recEvent(date: string): void {
57
- this.date = date.trim();
58
- },
59
- onMouseOver(ev: Event): void {
60
- if (this.positionFixed) {
61
- let el: HTMLElement = <HTMLElement>ev.currentTarget,
62
- b: DOMRect = el.getBoundingClientRect(),
63
- c: HTMLElement = <HTMLElement>this.$el.$(".aj-form-calendar");
64
-
65
- c.style.top = b.top + el.clientHeight - 0 + "px";
66
- c.style.left = b.left - 0 + 0 + "px";
67
- }
68
- },
69
- },
70
- };
71
- </script>
@@ -1,70 +0,0 @@
1
- /**
2
- * 错误的元素
3
- */
4
- interface ErrorElement {
5
- /**
6
- * DOM 元素
7
- */
8
- el: HTMLFormControl;
9
- /**
10
- * 错误的讯息
11
- */
12
- msg: string;
13
- }
14
- /**
15
- * 通常是表单里面的 input 元素,但是 ts 没有对应的类型
16
- */
17
- export interface HTMLFormControl extends HTMLElement {
18
- type: string;
19
- disabled: boolean;
20
- validity: ValidityState;
21
- name: string;
22
- value: string;
23
- form: HTMLFormElement;
24
- }
25
- /**
26
- * 表单验证器
27
- */
28
- export declare class Validator {
29
- constructor(el: HTMLFormElement);
30
- /**
31
- * 表单元素
32
- */
33
- private el;
34
- private errorElements;
35
- /**
36
- * 对每一个表单元素监听事件,一失去焦点就触发表单验证
37
- */
38
- private checkEveryField;
39
- /**
40
- *
41
- * @param err
42
- */
43
- private showError;
44
- /**
45
- * 移除所有的错误信息
46
- *
47
- * @param el
48
- */
49
- private removeError;
50
- /**
51
- * 是否忽略的表单元素
52
- *
53
- * @param el
54
- */
55
- private static isIgnoreEl;
56
- /**
57
- * 验证字段
58
- *
59
- * @param field 表单字段元素
60
- * @returns 若验证通过返回 null,否则返回 ErrorElement
61
- */
62
- static check(field: HTMLFormControl): ErrorElement | null;
63
- /**
64
- * 是否通过验证
65
- *
66
- * @param form
67
- */
68
- static onSubmit(form: HTMLFormElement): boolean;
69
- }
70
- export {};
@@ -1,220 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Validator = void 0;
4
- if (!('validity' in document.createElement('input')))
5
- window.alert("不支持 HTML5 表单验证");
6
- /**
7
- * 表单验证器
8
- */
9
- class Validator {
10
- constructor(el) {
11
- this.errorElements = [];
12
- // let isMsgNewLine: boolean = el.dataset.msgNewline === "true";
13
- el.setAttribute('novalidate', 'true'); // 禁止浏览器原生的错误提示
14
- this.el = el;
15
- this.checkEveryField();
16
- }
17
- /**
18
- * 对每一个表单元素监听事件,一失去焦点就触发表单验证
19
- */
20
- checkEveryField() {
21
- let arr = this.el.querySelectorAll('input');
22
- arr.forEach((input) => {
23
- input.addEventListener('blur', (ev) => {
24
- let el = ev.target;
25
- if (el.tagName == "A" || Validator.isIgnoreEl(el)) // 忽略部分元素;a 元素也有 blur 事件,忽略之
26
- return;
27
- let result = Validator.check(el);
28
- if (result) { // 如果有错误,就把它显示出来
29
- this.errorElements.push(result);
30
- this.showError(result);
31
- }
32
- else
33
- this.removeError(el); // 否则, 移除所有存在的错误信息
34
- }, true);
35
- });
36
- }
37
- /**
38
- *
39
- * @param err
40
- */
41
- showError(err) {
42
- var _a;
43
- let el = err.el, id = el.id || el.name; // 获取字段 id 或者 name
44
- if (!id)
45
- return;
46
- err.el.classList.add('error'); // 将错误类添加到字段
47
- // 检查错误消息字段是否已经存在 如果没有, 就创建一个
48
- let message = err.el.form.querySelector(`.error-message#error-for-${id}`);
49
- if (!message) {
50
- message = document.createElement('div');
51
- message.className = 'error-message';
52
- message.id = 'error-for-' + id;
53
- (_a = el.parentNode) === null || _a === void 0 ? void 0 : _a.insertBefore(message, el.nextSibling);
54
- }
55
- el.setAttribute('aria-describedby', 'error-for-' + id); // 添加 ARIA role 到字段
56
- message.innerHTML = err.msg; // 更新错误信息
57
- // if (!isNewLine)// 显示错误信息
58
- // message.style.display = 'inline-block';
59
- message.classList.remove('hide');
60
- }
61
- /**
62
- * 移除所有的错误信息
63
- *
64
- * @param el
65
- */
66
- removeError(el) {
67
- let id = el.id || el.name; // 获取字段的 id 或者 name
68
- if (!id)
69
- return;
70
- el.classList.remove('error'); // 删除字段的错误类
71
- el.removeAttribute('aria-describedby'); // 移除字段的 ARIA role
72
- let message = el.form.querySelector(`.error-message#error-for-${id}`); // 检查 DOM 中是否有错误消息
73
- if (message) {
74
- message.innerHTML = ''; // 如果有错误消息就隐藏它
75
- message.classList.add('hide');
76
- }
77
- }
78
- /**
79
- * 是否忽略的表单元素
80
- *
81
- * @param el
82
- */
83
- static isIgnoreEl(el) {
84
- return el.disabled || el.type === 'file' || el.type === 'reset' || el.type === 'submit' || el.type === 'button';
85
- }
86
- /**
87
- * 验证字段
88
- *
89
- * @param field 表单字段元素
90
- * @returns 若验证通过返回 null,否则返回 ErrorElement
91
- */
92
- static check(field) {
93
- // if (!field || !field.getAttribute)
94
- // console.log(field);
95
- let validity = field.validity; // 获取 validity
96
- if (!validity)
97
- throw '浏览器不支持 HTML5 表单验证';
98
- if (validity.valid) // 通过验证
99
- return null;
100
- else {
101
- let result = {
102
- el: field,
103
- msg: "无效输入" // 通用错误讯息 The value you entered for this field is invalid.
104
- };
105
- if (validity.valueMissing) // 如果是必填字段但是字段为空时
106
- result.msg = '该项是必填项';
107
- if (validity.typeMismatch) { // 如果类型不正确
108
- if (field.type === 'email')
109
- result.msg = '请输入有效的邮件地址';
110
- else if (field.type === 'url')
111
- result.msg = '请输入一个有效的网址';
112
- else
113
- result.msg = '请输入正确的类型';
114
- }
115
- if (validity.tooShort)
116
- result.msg = `请输入至少${field.getAttribute('minLength')}个字符。当前你输入了${field.value.length}个字符。`;
117
- // 'Please lengthen this text to ' + field.getAttribute('minLength') + ' characters or more. You are currently using ' + field.value.length + ' characters.'
118
- if (validity.tooLong)
119
- result.msg = `你只能输入最多${field.getAttribute('maxLength')}个字符。当前你输入了${field.value.length}个字符。`;
120
- // 'Please shorten this text to no more than ' + field.getAttribute('maxLength') + ' characters. You are currently using ' + field.value.length + ' characters.';
121
- if (validity.badInput)
122
- result.msg = '请输入数字';
123
- if (validity.stepMismatch) // 如果数字值与步进间隔不匹配
124
- result.msg = '请选择一个有效值';
125
- if (validity.rangeOverflow) // 如果数字字段的值大于 max 的值
126
- result.msg = `请选择小于 ${field.getAttribute('max')} 的值`;
127
- // return 'Please select a value that is no more than ' + field.getAttribute('max') + '.';
128
- if (validity.rangeUnderflow)
129
- result.msg = `请选择大于 ${field.getAttribute('min')} 的值`;
130
- // return 'Please select a value that is no less than ' + field.getAttribute('min') + '.';
131
- if (validity.patternMismatch)
132
- result.msg = field.getAttribute('title') || '格式要求不正确';
133
- return result;
134
- }
135
- }
136
- /**
137
- * 是否通过验证
138
- *
139
- * @param form
140
- */
141
- static onSubmit(form) {
142
- let fields = form.elements; // 获取所有的表单元素
143
- // 验证每一个字段
144
- // 将具有错误的第一个字段存储到变量中以便稍后我们将其默认获得焦点
145
- let error, hasErrors = null;
146
- for (let i = 0, j = fields.length; i < j; i++) {
147
- let el = fields[i];
148
- error = this.check(el);
149
- if (error) {
150
- // showError(el);
151
- if (!hasErrors) // 如果有错误,停止提交表单并使出现错误的第一个元素获得焦点
152
- hasErrors = el;
153
- }
154
- }
155
- if (hasErrors) {
156
- hasErrors.focus();
157
- return false;
158
- }
159
- return true;
160
- }
161
- }
162
- exports.Validator = Validator;
163
- // ; (function (window, document, undefined) { // 确保 ValidityState 全部被支持 (所有的功能)
164
- // var supported = function () {
165
- // var input = document.createElement('input');
166
- // return ('validity' in input && 'badInput' in input.validity && 'patternMismatch' in input.validity && 'rangeOverflow' in input.validity && 'rangeUnderflow' in input.validity && 'stepMismatch' in input.validity && 'tooLong' in input.validity && 'tooShort' in input.validity && 'typeMismatch' in input.validity && 'valid' in input.validity && 'valueMissing' in input.validity);
167
- // };
168
- // /**
169
- // * Generate the field validity object
170
- // * @param {Node]} field The field to validate
171
- // * @return {Object} The validity object
172
- // **/
173
- // var getValidityState = function (field) {
174
- // // 变量
175
- // var type = field.getAttribute('type') || input.nodeName.toLowerCase();
176
- // var isNum = type === 'number' || type === 'range';
177
- // var length = field.value.length; var valid = true;
178
- // //检测支持性
179
- // var checkValidity = {
180
- // badInput: (isNum && length > 0 && !/[-+]?[0-9]/.test(field.value)),
181
- // // 数字字段的值不是数字
182
- // patternMismatch: (field.hasAttribute('pattern') && length > 0 && new RegExp(field.getAttribute('pattern')).test(field.value) === false),
183
- // // 输入的值不符合模式
184
- // rangeOverflow: (field.hasAttribute('max') && isNum && field.value > 1 && parseInt(field.value, 10) > parseInt(field.getAttribute('max'), 10)),
185
- // // 数字字段的值大于max属性值
186
- // rangeUnderflow: (field.hasAttribute('min') && isNum && field.value > 1 && parseInt(field.value, 10) < parseInt(field.getAttribute('min'), 10)),
187
- // // 数字字段的值小于min属性值
188
- // stepMismatch: (field.hasAttribute('step') && field.getAttribute('step') !== 'any' && isNum && Number(field.value) % parseFloat(field.getAttribute('step')) !== 0),
189
- // // 数字字段的值不符合 stepattribute
190
- // tooLong: (field.hasAttribute('maxLength') && field.getAttribute('maxLength') > 0 && length > parseInt(field.getAttribute('maxLength'), 10)),
191
- // // 用户在具有maxLength属性的字段中输入的值的长度大于属性值
192
- // tooShort: (field.hasAttribute('minLength') && field.getAttribute('minLength') > 0 && length > 0 && length < parseInt(field.getAttribute('minLength'), 10)),
193
- // // 用户在具有minLength属性的字段中输入的值的长度小于属性值
194
- // typeMismatch: (length > 0 && ((type === 'email' && !/^([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22))*\x40([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d))*$/.test(field.value)) || (type === 'url' && !/^(?:(?:https?|HTTPS?|ftp|FTP):\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-zA-Z\u00a1-\uffff0-9]-*)*[a-zA-Z\u00a1-\uffff0-9]+)(?:\.(?:[a-zA-Z\u00a1-\uffff0-9]-*)*[a-zA-Z\u00a1-\uffff0-9]+)*)(?::\d{2,5})?(?:[\/?#]\S*)?$/.test(field.value)))),
195
- // // email 或者 URL 字段的值不是一个 email地址或者 URL
196
- // valueMissing: (field.hasAttribute('required') && (((type === 'checkbox' || type === 'radio') && !field.checked) || (type === 'select' && field.options[field.selectedIndex].value < 1) || (type !== 'checkbox' && type !== 'radio' && type !== 'select' && length < 1))) // 必填字段没有值
197
- // };
198
- // // 检查是否有错误
199
- // for (var key in checkValidity) {
200
- // if (checkValidity.hasOwnProperty(key)) {
201
- // // If there's an error, change valid value
202
- // if (checkValidity[key]) { valid = false; break; }
203
- // }
204
- // }
205
- // // 给 validity 对象添加 valid 属性
206
- // checkValidity.valid = valid;
207
- // // 返回对象
208
- // return checkValidity;
209
- // };
210
- // // 如果不支持完整的 ValidityState 功能,则可以使用polyfill
211
- // if (!supported()) {
212
- // Object.defineProperty(HTMLInputElement.prototype, 'validity', {
213
- // get: function ValidityState() {
214
- // return getValidityState(this);
215
- // },
216
- // configurable: true,
217
- // });
218
- // }
219
- // })(window, document);
220
- //# sourceMappingURL=validator.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"validator.js","sourceRoot":"","sources":["../../../src/widget/form/validator.ts"],"names":[],"mappings":"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"}
@@ -1,289 +0,0 @@
1
- /**
2
- * 错误的元素
3
- */
4
- interface ErrorElement {
5
- /**
6
- * DOM 元素
7
- */
8
- el: HTMLFormControl;
9
-
10
- /**
11
- * 错误的讯息
12
- */
13
- msg: string;
14
- }
15
-
16
- /**
17
- * 通常是表单里面的 input 元素,但是 ts 没有对应的类型
18
- */
19
- export interface HTMLFormControl extends HTMLElement {
20
- type: string;
21
- disabled: boolean;
22
- validity: ValidityState;
23
- name: string;
24
- value: string;
25
- form: HTMLFormElement;
26
- }
27
-
28
- if (!('validity' in document.createElement('input')))
29
- window.alert("不支持 HTML5 表单验证");
30
-
31
- /**
32
- * 表单验证器
33
- */
34
- export class Validator {
35
- constructor(el: HTMLFormElement) {
36
- // let isMsgNewLine: boolean = el.dataset.msgNewline === "true";
37
- el.setAttribute('novalidate', 'true');// 禁止浏览器原生的错误提示
38
- this.el = el;
39
- this.checkEveryField();
40
- }
41
-
42
- /**
43
- * 表单元素
44
- */
45
- private el: HTMLFormElement;
46
-
47
- private errorElements: ErrorElement[] = [];
48
-
49
- /**
50
- * 对每一个表单元素监听事件,一失去焦点就触发表单验证
51
- */
52
- private checkEveryField(): void {
53
- let arr: NodeListOf<HTMLInputElement> = this.el.querySelectorAll('input');
54
- arr.forEach((input: HTMLInputElement) => {
55
- input.addEventListener('blur', (ev: Event) => {
56
- let el: HTMLFormControl = <HTMLFormControl>ev.target;
57
-
58
- if (el.tagName == "A" || Validator.isIgnoreEl(el))// 忽略部分元素;a 元素也有 blur 事件,忽略之
59
- return;
60
-
61
- let result: ErrorElement | null = Validator.check(el);
62
-
63
- if (result) { // 如果有错误,就把它显示出来
64
- this.errorElements.push(result);
65
- this.showError(result);
66
- } else
67
- this.removeError(el); // 否则, 移除所有存在的错误信息
68
- }, true);
69
- });
70
- }
71
-
72
- /**
73
- *
74
- * @param err
75
- */
76
- private showError(err: ErrorElement): void {
77
- let el = err.el,
78
- id: string = el.id || el.name; // 获取字段 id 或者 name
79
-
80
- if (!id)
81
- return;
82
-
83
- err.el.classList.add('error'); // 将错误类添加到字段
84
-
85
- // 检查错误消息字段是否已经存在 如果没有, 就创建一个
86
- let message = err.el.form.querySelector(`.error-message#error-for-${id}`);
87
- if (!message) {
88
- message = document.createElement('div');
89
- message.className = 'error-message';
90
- message.id = 'error-for-' + id;
91
- el.parentNode?.insertBefore(message, el.nextSibling);
92
- }
93
-
94
- el.setAttribute('aria-describedby', 'error-for-' + id);// 添加 ARIA role 到字段
95
- (<HTMLElement>message).innerHTML = err.msg;// 更新错误信息
96
-
97
- // if (!isNewLine)// 显示错误信息
98
- // message.style.display = 'inline-block';
99
-
100
- (<HTMLElement>message).classList.remove('hide');
101
- }
102
-
103
- /**
104
- * 移除所有的错误信息
105
- *
106
- * @param el
107
- */
108
- private removeError(el: HTMLFormControl): void {
109
- let id: string = el.id || el.name;// 获取字段的 id 或者 name
110
- if (!id)
111
- return;
112
-
113
- el.classList.remove('error'); // 删除字段的错误类
114
- el.removeAttribute('aria-describedby'); // 移除字段的 ARIA role
115
-
116
- let message: HTMLElement | null = <HTMLElement | null>el.form.querySelector(`.error-message#error-for-${id}`); // 检查 DOM 中是否有错误消息
117
- if (message) {
118
- message.innerHTML = ''; // 如果有错误消息就隐藏它
119
- message.classList.add('hide');
120
- }
121
- }
122
-
123
- /**
124
- * 是否忽略的表单元素
125
- *
126
- * @param el
127
- */
128
- private static isIgnoreEl(el: HTMLFormControl): boolean {
129
- return el.disabled || el.type === 'file' || el.type === 'reset' || el.type === 'submit' || el.type === 'button';
130
- }
131
-
132
- /**
133
- * 验证字段
134
- *
135
- * @param field 表单字段元素
136
- * @returns 若验证通过返回 null,否则返回 ErrorElement
137
- */
138
- public static check(field: HTMLFormControl): ErrorElement | null {
139
- // if (!field || !field.getAttribute)
140
- // console.log(field);
141
-
142
- let validity: ValidityState = field.validity; // 获取 validity
143
-
144
- if (!validity)
145
- throw '浏览器不支持 HTML5 表单验证';
146
-
147
- if (validity.valid) // 通过验证
148
- return null;
149
- else {
150
- let result: ErrorElement = {
151
- el: field,
152
- msg: "无效输入" // 通用错误讯息 The value you entered for this field is invalid.
153
- };
154
-
155
- if (validity.valueMissing) // 如果是必填字段但是字段为空时
156
- result.msg = '该项是必填项';
157
-
158
- if (validity.typeMismatch) { // 如果类型不正确
159
- if (field.type === 'email')
160
- result.msg = '请输入有效的邮件地址';
161
- else if (field.type === 'url')
162
- result.msg = '请输入一个有效的网址';
163
- else
164
- result.msg = '请输入正确的类型';
165
- }
166
-
167
- if (validity.tooShort)
168
- result.msg = `请输入至少${field.getAttribute('minLength')}个字符。当前你输入了${field.value.length}个字符。`;
169
- // 'Please lengthen this text to ' + field.getAttribute('minLength') + ' characters or more. You are currently using ' + field.value.length + ' characters.'
170
-
171
- if (validity.tooLong)
172
- result.msg = `你只能输入最多${field.getAttribute('maxLength')}个字符。当前你输入了${field.value.length}个字符。`;
173
- // 'Please shorten this text to no more than ' + field.getAttribute('maxLength') + ' characters. You are currently using ' + field.value.length + ' characters.';
174
-
175
- if (validity.badInput)
176
- result.msg = '请输入数字';
177
-
178
- if (validity.stepMismatch) // 如果数字值与步进间隔不匹配
179
- result.msg = '请选择一个有效值';
180
-
181
- if (validity.rangeOverflow) // 如果数字字段的值大于 max 的值
182
- result.msg = `请选择小于 ${field.getAttribute('max')} 的值`;
183
- // return 'Please select a value that is no more than ' + field.getAttribute('max') + '.';
184
-
185
- if (validity.rangeUnderflow)
186
- result.msg = `请选择大于 ${field.getAttribute('min')} 的值`;
187
- // return 'Please select a value that is no less than ' + field.getAttribute('min') + '.';
188
-
189
- if (validity.patternMismatch)
190
- result.msg = field.getAttribute('title') || '格式要求不正确';
191
-
192
- return result;
193
- }
194
- }
195
-
196
- /**
197
- * 是否通过验证
198
- *
199
- * @param form
200
- */
201
- public static onSubmit(form: HTMLFormElement): boolean {
202
- let fields: HTMLFormControlsCollection = form.elements;// 获取所有的表单元素
203
-
204
- // 验证每一个字段
205
- // 将具有错误的第一个字段存储到变量中以便稍后我们将其默认获得焦点
206
- let error: ErrorElement | null, hasErrors: HTMLElement | null = null;
207
-
208
- for (let i = 0, j = fields.length; i < j; i++) {
209
- let el: HTMLFormControl = <HTMLFormControl>fields[i];
210
- error = this.check(el);
211
-
212
- if (error) {
213
- // showError(el);
214
- if (!hasErrors) // 如果有错误,停止提交表单并使出现错误的第一个元素获得焦点
215
- hasErrors = <HTMLElement>el;
216
- }
217
- }
218
-
219
- if (hasErrors) {
220
- hasErrors.focus();
221
- return false;
222
- }
223
-
224
- return true;
225
- }
226
- }
227
-
228
-
229
- // ; (function (window, document, undefined) { // 确保 ValidityState 全部被支持 (所有的功能)
230
- // var supported = function () {
231
- // var input = document.createElement('input');
232
- // return ('validity' in input && 'badInput' in input.validity && 'patternMismatch' in input.validity && 'rangeOverflow' in input.validity && 'rangeUnderflow' in input.validity && 'stepMismatch' in input.validity && 'tooLong' in input.validity && 'tooShort' in input.validity && 'typeMismatch' in input.validity && 'valid' in input.validity && 'valueMissing' in input.validity);
233
- // };
234
-
235
- // /**
236
- // * Generate the field validity object
237
- // * @param {Node]} field The field to validate
238
- // * @return {Object} The validity object
239
- // **/
240
- // var getValidityState = function (field) {
241
- // // 变量
242
- // var type = field.getAttribute('type') || input.nodeName.toLowerCase();
243
- // var isNum = type === 'number' || type === 'range';
244
- // var length = field.value.length; var valid = true;
245
- // //检测支持性
246
- // var checkValidity = {
247
- // badInput: (isNum && length > 0 && !/[-+]?[0-9]/.test(field.value)),
248
- // // 数字字段的值不是数字
249
- // patternMismatch: (field.hasAttribute('pattern') && length > 0 && new RegExp(field.getAttribute('pattern')).test(field.value) === false),
250
- // // 输入的值不符合模式
251
- // rangeOverflow: (field.hasAttribute('max') && isNum && field.value > 1 && parseInt(field.value, 10) > parseInt(field.getAttribute('max'), 10)),
252
- // // 数字字段的值大于max属性值
253
- // rangeUnderflow: (field.hasAttribute('min') && isNum && field.value > 1 && parseInt(field.value, 10) < parseInt(field.getAttribute('min'), 10)),
254
- // // 数字字段的值小于min属性值
255
- // stepMismatch: (field.hasAttribute('step') && field.getAttribute('step') !== 'any' && isNum && Number(field.value) % parseFloat(field.getAttribute('step')) !== 0),
256
- // // 数字字段的值不符合 stepattribute
257
- // tooLong: (field.hasAttribute('maxLength') && field.getAttribute('maxLength') > 0 && length > parseInt(field.getAttribute('maxLength'), 10)),
258
- // // 用户在具有maxLength属性的字段中输入的值的长度大于属性值
259
- // tooShort: (field.hasAttribute('minLength') && field.getAttribute('minLength') > 0 && length > 0 && length < parseInt(field.getAttribute('minLength'), 10)),
260
- // // 用户在具有minLength属性的字段中输入的值的长度小于属性值
261
- // typeMismatch: (length > 0 && ((type === 'email' && !/^([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22))*\x40([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d))*$/.test(field.value)) || (type === 'url' && !/^(?:(?:https?|HTTPS?|ftp|FTP):\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-zA-Z\u00a1-\uffff0-9]-*)*[a-zA-Z\u00a1-\uffff0-9]+)(?:\.(?:[a-zA-Z\u00a1-\uffff0-9]-*)*[a-zA-Z\u00a1-\uffff0-9]+)*)(?::\d{2,5})?(?:[\/?#]\S*)?$/.test(field.value)))),
262
- // // email 或者 URL 字段的值不是一个 email地址或者 URL
263
- // valueMissing: (field.hasAttribute('required') && (((type === 'checkbox' || type === 'radio') && !field.checked) || (type === 'select' && field.options[field.selectedIndex].value < 1) || (type !== 'checkbox' && type !== 'radio' && type !== 'select' && length < 1))) // 必填字段没有值
264
- // };
265
-
266
- // // 检查是否有错误
267
- // for (var key in checkValidity) {
268
- // if (checkValidity.hasOwnProperty(key)) {
269
- // // If there's an error, change valid value
270
- // if (checkValidity[key]) { valid = false; break; }
271
- // }
272
- // }
273
- // // 给 validity 对象添加 valid 属性
274
- // checkValidity.valid = valid;
275
- // // 返回对象
276
- // return checkValidity;
277
- // };
278
-
279
- // // 如果不支持完整的 ValidityState 功能,则可以使用polyfill
280
- // if (!supported()) {
281
- // Object.defineProperty(HTMLInputElement.prototype, 'validity', {
282
- // get: function ValidityState() {
283
- // return getValidityState(this);
284
- // },
285
- // configurable: true,
286
- // });
287
- // }
288
- // })(window, document);
289
-