Hay muchos de mis amigos han compartido en RDCC sobre cómo utilizar la llamada Dynamic Web TWAIN en el escáner de documentos página. bacterias uno de ellos amigos entusiastas Rogan, publicó un blog " ¿Cómo lograr la rápida llamada escáner de documentos en la página " trilogía, concisa y fácil de entender, para la mayoría de los desarrolladores de proyectos tienen necesidades en esta referencia respecto. Este artículo se basa en una bacteria trilogía Rogan liberados, que muestran cómo utilizar la tecla de acceso directo para llamar al escáner para escanear documentos en una página Web.
aprender atajos
Los accesos directos no es lo que debería hacer más para introducir, si usted tiene amigos tienen preguntas, puede el lugar y Baidu Encyclopedia. >> atajos _ Baidu Enciclopedia
Entonces, ¿cómo JS, situado en una página web como una página web accesos directos a un número de clics del ratón en lugar de la misma?
En primer lugar, tenemos que entender cada código de tecla del teclado que corresponde a cada una de códigos de teclas clave. de referencia propuesto >> tabla de códigos de teclas (tabla de códigos de llave)
En segundo lugar, podemos escuchar los eventos de teclado keyUp, keydown, pulsación de tecla o llamar a la función de controlar la interfaz.
Específicamente cómo aplicar a nuestro proyecto para escanearlo?
Establecer un acceso directo de escaneo paso
Paso 1
En primer lugar, nos pasó el blog de Luogen junio "Cómo lograr rápida llamada escáner de documentos en una página Web (3)" Se puede aprender a utilizar dentro de los 5 minutos dinámico Web TWAIN para construir una de las mayoría de las páginas básicas de escaneo simple.
Nota: La última versión de la etapa de Web dinámica TWAIN 14.3.1
Hello World código es el siguiente:
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
<script type="text/javascript" src="Resources/dynamsoft.webtwain.initiate.js"></script>
<script type="text/javascript" src="Resources/dynamsoft.webtwain.config.js"></script>
</head>
<body>
<div id="dwtcontrolContainer"></div>
<input type="button" value="Scan" onclick="AcquireImage();" />
<script type="text/javascript">
function AcquireImage() {
var DWObject = Dynamsoft.WebTwainEnv.GetWebTwain('dwtcontrolContainer');
if (DWObject) {
DWObject.SelectSource(function () {
var OnAcquireImageSuccess, OnAcquireImageFailure;
OnAcquireImageSuccess = OnAcquireImageFailure = function () {
DWObject.CloseSource();
};
DWObject.OpenSource();
DWObject.IfDisableSourceAfterAcquire = true;
DWObject.AcquireImage(OnAcquireImageSuccess, OnAcquireImageFailure);
}, function () {
console.log('SelectSource failed!');
});
}
}
</script>
</body>
</html>
Debido Hello World es el más fácil de conseguir código de la página de exploración, por lo que con el fin de provocar la huella equipo innecesario y otras cuestiones, podemos hacer algunos cambios complementan el código Hello World, de la siguiente manera.
<!DOCTYPE html>
<html>
<head>
<title>Use Dynamic Web TWAIN's built-in Events</title>
<script type="text/javascript" src="Resources/dynamsoft.webtwain.initiate.js"> </script>
<script type="text/javascript" src="Resources/dynamsoft.webtwain.config.js"> </script>
</head>
<body>
<input type="button" value="Scan" onclick="AcquireImage();" />
<br />
<span id='info'></span>
<!-- dwtcontrolContainer is the default div id for Dynamic Web TWAIN control.
If you need to rename the id, you should also change the id in the dynamsoft.webtwain.config.js accordingly. -->
<div id="dwtcontrolContainer"></div>
<script type="text/javascript">
Dynamsoft.WebTwainEnv.RegisterEvent('OnWebTwainReady', Dynamsoft_OnReady); // Register OnWebTwainReady event. This event fires as soon as Dynamic Web TWAIN is initialized and ready to be used
var DWObject;
function Dynamsoft_OnReady() {
DWObject = Dynamsoft.WebTwainEnv.GetWebTwain('dwtcontrolContainer'); // Get the Dynamic Web TWAIN object that is embeded in the div with id 'dwtcontrolContainer'
}
function AcquireImage() {
if (DWObject) {
DWObject.IfDisableSourceAfterAcquire = true; // Scanner source will be disabled/closed automatically after the scan.
DWObject.SelectSource(function () { // Select a Data Source (a device like scanner) from the Data Source Manager.
var OnAcquireImageSuccess, OnAcquireImageFailure;
OnAcquireImageSuccess = OnAcquireImageFailure = function () {
DWObject.CloseSource();
};
DWObject.OpenSource(); // Open the source. You can set resolution, pixel type, etc. after this method. Please refer to the sample 'Scan' -> 'Custom Scan' for more info.
DWObject.AcquireImage(OnAcquireImageSuccess, OnAcquireImageFailure); // Acquire image(s) from the Data Source. Please NOTE this is a asynchronous method. In other words, it doesn't wait for the Data Source to come back.
}, function () {
console.log('SelectSource failed!');
});
}
}
</script>
</body>
</html>
En el código anterior no es difícil de encontrar, la función de llamada AcquireImage () puede ser llamado escáner para escanear la página.
Paso 2
Establecer atajos de teclado para invocar la función AcquireImage (), con el fin de mantener pulsada la tecla Ctrl + Q, por ejemplo.
código de tecla Ctrl es 17, Q para el código de la llave 81.
//Press Ctrl+Q to start the scan, keycode for Ctrl is 17, keycode for Q is 81.
var key_pressed={};
document.addEventListener("keyup",function(e){
if (key_pressed[17] && key_pressed[81]){
AcquireImage(); //scan function
key_pressed[17]=false;
key_pressed[81]=false;
}
//console.log(e.keyCode+" is up");
});
document.addEventListener("keydown",function(e){
key_pressed[e.keyCode]=true;
//console.log(e.keyCode+" is down");
});
KeyDown juzgados por los oyentes y keyUp tecla Ctrl y dos llaves si la tecla Q prensa, cuando dos teclas se presionan entre sí y se liberan, llamando a la función AcquireImage () para escanear la página.
resumen
Por llamada de acceso directo a la función de exploración es una función de JS lograr, por supuesto, esta sección del código también se puede usar atajos en otra escena, con la esperanza de ayudar al lector.
