diff --git a/src/component/LoginPage/verificationCodeInput.vue b/src/component/LoginPage/verificationCodeInput.vue index 1582ec65..2a18a5f2 100644 --- a/src/component/LoginPage/verificationCodeInput.vue +++ b/src/component/LoginPage/verificationCodeInput.vue @@ -4,9 +4,11 @@ @@ -55,6 +57,7 @@ export default defineComponent({ }, methods: { onInput(val, index) { + console.log('input',val,index) // val = val.replace(/[^0-9]/g, ''); val = String(val).replace(/\D/g, ''); this.getCtData[index] = val @@ -80,14 +83,29 @@ export default defineComponent({ index = (index + this.ctSize) % this.ctSize; this.$refs.input[index].focus(); }, - onKeydown(val, index) { - if (val === '') { - // 删除上一个input里的值,并对其focus。 - if (index > 0) { - this.getCtData[index - 1] = ''; - this.$refs.input[index - 1].focus(); + onKeypress(e) { + // 只允许输入数字0-9 + const char = String.fromCharCode(e.which); + if (!/[0-9]/.test(char)) { + e.preventDefault(); + } + }, + onKeydown(e, index) { + // 处理删除键 + if (e.key === 'Backspace' || e.key === 'Delete') { + const val = e.target.value; + if (val === '') { + // 删除上一个input里的值,并对其focus。 + if (index > 0) { + this.getCtData[index - 1] = ''; + this.$refs.input[index - 1].focus(); + } } } + // 阻止其他非数字字符 + else if (e.key && !/[0-9]/.test(e.key) && !['Backspace', 'Delete', 'Tab', 'Enter', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'].includes(e.key)) { + e.preventDefault(); + } }, sendCaptcha() {