javascript - 意外的粘贴事件行为

Question

我创建了一个竞赛表格。我有 4 个文本框，每个文本框包含 4 个字符，然后组合起来创建一个 16 位代码。这一切都工作正常。

Example Code: LAME DKAJ XWNS YXRZ

我的问题是，我想监视粘贴事件(如果用户决定粘贴代码)。然而，源代码中的 16 位数字包含空格 - 我的目标是将这些空格处的代码拆分为 4 组，每组 4 个字符，并自动填充方框。

但是，当使用粘贴事件时，我遇到了意外的行为。例如，第一次将文本粘贴到框中时，该值的 console.log 返回一个空白字符串。第二个粘贴记录了第一个粘贴中应该包含的内容，依此类推。这向我表明它是在粘贴事件开始时记录的，而不是在代码粘贴到文本框中之后记录的。我这样做是错误的，还是有意为之？

如果这是粘贴事件的预期行为，那么如何在粘贴事件完成后捕获框中的文本？

https://jsfiddle.net/h4w946js/ (check the console)

// JS CODE

function splitCode(){
    var input = document.getElementById('part1');

    input.addEventListener('paste', function(){
        console.log(this.value);
    })
}

Answer 1

要获取粘贴的文本，请使用以下代码:

input.addEventListener('paste', function(e) {
    if (window.clipboardData && window.clipboardData.getData) { // IE
        console.log(window.clipboardData.getData('Text'));
    } else if (e.clipboardData && e.clipboardData.getData) { // other browsers
        console.log(e.clipboardData.getData('text/plain'));
    }
});