Javascript复制和粘贴不能正确格式化模型值

Javascript copy and pasting doesn't format model value correctly

本文关键字:格式化 模型 不能 复制 Javascript      更新时间:2023-09-26

我正在制作一个SSN格式化器。下面是我的代码:

            element.keyup(function(event) {
                var inputField = event.target;
                var val = inputField.value.replace(/[^0-9]/g, '');
                var newVal = '';
                if(val.length > 3 && val.length < 6) {
                    newVal += val.substr(0, 3) + '-';
                    val = val.substr(3);
                }
                if (val.length > 5) {
                    newVal += val.substr(0, 3) + '-';
                    newVal += val.substr(3, 2) + '-';
                    val = val.substr(5,4);
                }
                newVal += val;
                inputField.value = newVal;
            })
            .keypress(function(event) {
                if(event.target.value.length === 11) {
                  event.preventDefault();
                }
             });

手动输入数字可以正常工作,当我复制粘贴一个数字,如12345678901234567890文本框将其格式设置为123456789,但是模型值仍然显示为12345678901234567890,如果我从123456789中退格删除一个数字,那么模型值将变为12345678

我不知道发生了什么事?是因为keyup事件吗?不确定。

是的,这是因为keyup事件,它不检测您的粘贴。您应该使用输入事件:

        element.on("input", function(event) {
            var inputField = event.target;
            var val = inputField.value.replace(/[^0-9]/g, '');
            var newVal = '';
            if(val.length > 3 && val.length < 6) {
                newVal += val.substr(0, 3) + '-';
                val = val.substr(3);
            }
            if (val.length > 5) {
                newVal += val.substr(0, 3) + '-';
                newVal += val.substr(3, 2) + '-';
                val = val.substr(5,4);
            }
            newVal += val;
            inputField.value = newVal;
        })
        .keypress(function(event) {
            if(event.target.value.length === 11) {
              event.preventDefault();
            }
         });