输入框

This commit is contained in:
zh
2025-08-12 11:50:19 +08:00
parent 0007343353
commit a888969c5d
6 changed files with 86 additions and 18 deletions

View File

@ -56,7 +56,7 @@ function html(that) {
</div> </div>
</div> </div>
<div class="col"> <div class="col">
<span class="label">固定大小</span> <span class="label" style="flex: 0 0 60px;">固定大小</span>
<input class="btn-switch" type="checkbox" @model="scaleByDistance"> <input class="btn-switch" type="checkbox" @model="scaleByDistance">
</div> </div>
</div> </div>

View File

@ -21,6 +21,7 @@ class eventBinding {
let Event = [] let Event = []
let isEvent = false let isEvent = false
let removeName = [] let removeName = []
let blurEvent = () => { }
if (!elements[i] || !elements[i].attributes) { if (!elements[i] || !elements[i].attributes) {
continue continue
} }
@ -36,7 +37,8 @@ class eventBinding {
Event.push((e) => { Event.push((e) => {
let value = e.target.value let value = e.target.value
if (e.target.type == 'number') { if (e.target.type == 'number') {
if (e.data != '.' && (e.data != '-' || e.target.value)) { let str = e.target.value + ''
if (e.data != '.' && (e.data != '-' || e.target.value) && !(str.charAt(str.length - 1) == '0' && e.target.value.toString().includes('.')) && e.target.value != '0') {
value = Number(value) value = Number(value)
if((e.target.max) && value>Number(e.target.max)) { if((e.target.max) && value>Number(e.target.max)) {
value = Number(e.target.max) value = Number(e.target.max)
@ -57,6 +59,22 @@ class eventBinding {
that[m.value] = value that[m.value] = value
} }
}) })
blurEvent = (e) => {
let value = e.target.value
if (e.target.value || (e.target.dataset.null !== 'undefined' && e.target.dataset.null !== '' && !Boolean(e.target.dataset.null))) {
value = Number(value)
if ((e.target.max) && value > Number(e.target.max)) {
value = Number(e.target.max)
}
if ((e.target.min) && value < Number(e.target.min)) {
value = Number(e.target.min)
}
if ((e.target.dataset.min) && value < Number(e.target.dataset.min)) {
value = Number(e.target.dataset.min)
}
}
that[m.value] = value
}
if(elements[i].nodeName=='IMG') { if(elements[i].nodeName=='IMG') {
elements[i].src = that[m.value] elements[i].src = that[m.value]
} }
@ -114,6 +132,7 @@ class eventBinding {
Event[t](e) Event[t](e)
} }
}); });
elements[i].addEventListener('blur', blurEvent)
} }
} }
} }

View File

@ -21,6 +21,7 @@ class eventBinding {
let Event = [] let Event = []
let isEvent = false let isEvent = false
let removeName = [] let removeName = []
let blurEvent = ()=>{}
if (!elements[i] ||!elements[i].attributes) { if (!elements[i] ||!elements[i].attributes) {
continue; continue;
} }
@ -37,14 +38,14 @@ class eventBinding {
let value = e.target.value let value = e.target.value
if (e.target.type == 'number') { if (e.target.type == 'number') {
if (e.data != '.' && (e.data != '-' || e.target.value)) { if (e.data != '.' && (e.data != '-' || e.target.value)) {
value = Number(value) let v = Number(value)
if((e.target.max) && value>Number(e.target.max)) { if((e.target.max) && v>Number(e.target.max)) {
value = Number(e.target.max) value = Number(e.target.max)
} }
if((e.target.min) && value<Number(e.target.min)) { if((e.target.min) && v<Number(e.target.min)) {
value = Number(e.target.min) value = Number(e.target.min)
} }
if((e.target.dataset.min) && value<Number(e.target.dataset.min)) { if((e.target.dataset.min) && v<Number(e.target.dataset.min)) {
value = Number(e.target.dataset.min) value = Number(e.target.dataset.min)
} }
that[m.value] = value that[m.value] = value
@ -54,6 +55,22 @@ class eventBinding {
that[m.value] = value that[m.value] = value
} }
}) })
blurEvent = (e) => {
let value = e.target.value
if (e.target.value || (e.target.dataset.null !== 'undefined' && e.target.dataset.null !== '' && !Boolean(e.target.dataset.null))) {
value = Number(value)
if ((e.target.max) && value > Number(e.target.max)) {
value = Number(e.target.max)
}
if ((e.target.min) && value < Number(e.target.min)) {
value = Number(e.target.min)
}
if ((e.target.dataset.min) && value < Number(e.target.dataset.min)) {
value = Number(e.target.dataset.min)
}
}
that[m.value] = value
}
if(elements[i].nodeName=='IMG') { if(elements[i].nodeName=='IMG') {
elements[i].src = that[m.value] elements[i].src = that[m.value]
} }
@ -111,6 +128,9 @@ class eventBinding {
Event[t](e) Event[t](e)
} }
}); });
elements[i].addEventListener('blur', (e) => {
blurEvent(e)
});
} }
} }
} }

View File

@ -21,8 +21,9 @@ class eventBinding {
let Event = [] let Event = []
let isEvent = false let isEvent = false
let removeName = [] let removeName = []
if (!elements[i] ||!elements[i].attributes) { let blurEvent = () => { }
continue; if (!elements[i] || !elements[i].attributes) {
continue;
} }
for (let m of elements[i].attributes) { for (let m of elements[i].attributes) {
switch (m.name) { switch (m.name) {
@ -37,11 +38,11 @@ class eventBinding {
let value = e.target.value let value = e.target.value
if (e.target.type == 'number') { if (e.target.type == 'number') {
if (e.data != '.' && (e.data != '-' || e.target.value)) { if (e.data != '.' && (e.data != '-' || e.target.value)) {
value = Number(value) let v = Number(value)
if((e.target.max) && value>Number(e.target.max)) { if ((e.target.max) && v > Number(e.target.max)) {
value = Number(e.target.max) value = Number(e.target.max)
} }
if((e.target.min) && value<Number(e.target.min)) { if ((e.target.min) && v < Number(e.target.min)) {
value = Number(e.target.min) value = Number(e.target.min)
} }
that[m.value] = value that[m.value] = value
@ -51,14 +52,32 @@ class eventBinding {
that[m.value] = value that[m.value] = value
} }
}) })
if(elements[i].nodeName=='IMG') { blurEvent = (e) => {
let value = e.target.value
if (e.target.value || (e.target.dataset.null !== 'undefined' && e.target.dataset.null !== '' && !Boolean(e.target.dataset.null))) {
value = Number(value)
if ((e.target.max) && value > Number(e.target.max)) {
value = Number(e.target.max)
}
if ((e.target.min) && value < Number(e.target.min)) {
value = Number(e.target.min)
}
if ((e.target.dataset.min) && value < Number(e.target.dataset.min)) {
value = Number(e.target.dataset.min)
}
}
that[m.value] = value
}
if (elements[i].nodeName == 'IMG') {
elements[i].src = that[m.value] elements[i].src = that[m.value]
} }
else { else {
elements[i].value = that[m.value] elements[i].value = that[m.value]
} }
} }
if(this.element[m.value]) { if (this.element[m.value]) {
this.element[m.value].push(elements[i]) this.element[m.value].push(elements[i])
} }
else { else {
@ -81,7 +100,7 @@ class eventBinding {
isEvent = true isEvent = true
Event.push((e) => { Event.push((e) => {
let value = e.target.value let value = e.target.value
if(e.target.type == 'number' && value!='') { if (e.target.type == 'number' && value != '') {
value = Number(value) value = Number(value)
e.target.value = value e.target.value = value
} }
@ -94,7 +113,7 @@ class eventBinding {
} }
// elements[i].attributes[m] = undefined // elements[i].attributes[m] = undefined
} }
for(let n=0;n<removeName.length;n++) { for (let n = 0; n < removeName.length; n++) {
elements[i].attributes.removeNamedItem(removeName[n]) elements[i].attributes.removeNamedItem(removeName[n])
} }
@ -108,6 +127,9 @@ class eventBinding {
Event[t](e) Event[t](e)
} }
}); });
elements[i].addEventListener('blur', (e) => {
blurEvent(e)
});
} }
} }
} }

View File

@ -35,7 +35,8 @@ class eventBinding {
else { else {
Event.push((e) => { Event.push((e) => {
let value = e.target.value let value = e.target.value
if (e.target.type == 'number') { let str = e.target.value + ''
if (e.target.type == 'number' && !(str.charAt(str.length - 1) == '0' && e.target.value.toString().includes('.'))) {
value = Number(value) value = Number(value)
} }
that[m.value] = value that[m.value] = value

View File

@ -45,8 +45,14 @@ class EventBinding {
let value = e.target.value let value = e.target.value
value = Number(value) value = Number(value)
if (e.data != '.' && (e.data != '-' || e.target.value)) { if (e.data != '.' && (e.data != '-' || e.target.value)) {
if (((!e.target.max) && (!e.target.min)) || ((value <= Number(e.target.max)) && value >= Number(e.target.min))) { if ((e.target.max) && value > Number(e.target.max)) {
that[m.value] = value value = Number(e.target.max)
}
if ((e.target.min) && value < Number(e.target.min)) {
value = Number(e.target.min)
}
if ((e.target.dataset.min) && value < Number(e.target.dataset.min)) {
value = Number(e.target.dataset.min)
} }
} }
} }