未捕獲觸發的按鍵事件？

Question

我正在捕獲條形碼掃描器的輸入（它像鍵盤輸入一樣）並且效果很好，但目前我無法訪問條形碼掃描器並需要測試我的代碼，所以我需要模擬條碼掃描器（鍵盤）輸入。

我想觸發keypress事件爲每個字符將工作，但事實並非如此。這裏是我的測試代碼：

var barcodeScannerTimer; 
var barcodeString = ''; 

// capture barcode scanner input 
$('body').on('keypress', function (e) { 
    barcodeString = barcodeString + String.fromCharCode(e.charCode); 

    clearTimeout(barcodeScannerTimer); 
    barcodeScannerTimer = setTimeout(function() { 
     processBarcode(); 
    }, 300); 
}); 

function processBarcode() { 
    console.log('inside processBarcode with barcodeString "' + barcodeString + '"'); 

    if (!isNaN(barcodeString) && barcodeString != '') { // @todo this check is lame. improve. 
     alert('ready to process barcode: ' + barcodeString); 
    } else { 
     alert('barcode is invalid: ' + barcodeString); 
    } 

    barcodeString = ''; // reset 
} 


window.simulateBarcodeScan = function() { 
    // simulate a barcode being scanned 
    var barcode = '9781623411435'; 
    for (var i = 0; i < barcode.length; i++) { 
     var e = jQuery.Event("keypress"); 
     e.which = barcode[i].charCodeAt(0); 
     $("body").focus().trigger(e); 
    } 
} 

JSFIDDLE

如果您在多個快速輸入（如1234），你會看到輸入捕捉罰款。但是，請單擊按鈕以運行我的測試代碼，並且不會捕獲輸入。該事件被觸發，因爲彈出一個警告框，但barcodeString是空的！

爲什麼不能正常工作？我是否應該觸發keypress以外的事件？

Answer 1

處理程序正在讀取charCode，但您只在該事件上設置了which。設置charCode，或從which讀取。 https://jsfiddle.net/mendesjuan/bzfeuezv/1/

barcodeString = barcodeString + String.fromCharCode(e.which); 

觸發合成事件

這是一個提醒，射擊合成事件是棘手的問題，通常需要你有處理程序的深入瞭解（這是壞的），這樣你就不必構建一個完整的事件對象。此外，請注意，並非所有由jQuery觸發的事件都會實際觸發本機事件並導致默認操作應用。

簡而言之，觸發keypress實際上並不是將一個字符輸入到文本字段中，或是觸發未使用jQuery設置的事件處理程序。

document.querySelector('input').addEventListener('keypress', function() { 
 
    console.log('standard input key press handler'); 
 
}); 
 

 

 
var e = jQuery.Event("keypress"); 
 
e.which = "a".charCodeAt(0); 
 
$('input').keypress(function(){ 
 
    console.log('jQuery input key press handler'); 
 
}).trigger('keypress', e);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input value="yo" />