Javascript 复制和粘贴无法正确格式化模型值

Question

我正在制作一个 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 之类的数字时 文本框会将其格式设置为 123-45-6789，但是模型值仍然显示为 12345678901234567890，如果我按退格键从 123-45-6789 中删除一个数字，则模型值将变为 123-45-678

我不知道发生了什么？是因为 keyup 事件吗？没有把握。希望得到帮助。

Answer 1

是的，这是因为 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();
            }
         });