2016-04-14 78 views
0

我已經創建了一個競爭表單。我有4個文本框,每個文本框需要4個字符,然後組合在一起創建一個16位數的代碼。這一切工作正常。意外的粘貼事件行爲

示例代碼:LAME DKAJ XWNS YXRZ

我的問題是,我想監視粘貼事件(如果用戶決定粘貼代碼)。但是,源代碼中的16位數字代碼包含空格 - 我的目標是在這些空格處分割代碼,以給我4組4個字符並自動填充框。

但是,當使用粘貼事件時,我遇到意外的行爲。例如,我第一次將文本粘貼到框中時,該值的console.log返回空白字符串。第二個粘貼日誌應該在第一個日誌中記錄,等等。這表明它在粘貼事件的開始處記錄日誌,而不是在將代碼粘貼到文本框之後。我做錯了,還是這是打算?

如果這是粘貼事件的預期行爲,那麼在粘貼事件完成後如何捕獲框中的文本?

https://jsfiddle.net/h4w946js/(檢查控制檯)

// JS CODE 

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

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

這是它的工作方式,是的。 – Pointy

+2

你可以使用'setTimeout()'在「粘貼」事件循環結束後採取行動。 – Pointy

回答

2

得到粘貼的文本使用此代碼:

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')); 
    } 
}); 
+0

@ h2ooooooo固定。 – jcubic

+0

完美,非常感謝。 – Lewis