jQuery: прослушивание автоматического ввода со сканера с клавиатуры? - PullRequest
Новая
       10

jQuery: прослушивание автоматического ввода со сканера с клавиатуры?

6 голосов
/ 07 января 2011

Я пишу веб-приложение для библиотечной системы с подключенным сканером штрих-кода.Вход для сканера представлен как ввод с клавиатуры, и он всегда имеет форму ~~[\d]+.[\d]+~~, например ~~470.002~~.

. Я хочу настроить слушатель jQuery для ввода со сканера, и я новичок в jQuery.Он должен прослушивать весь ввод с клавиатуры, но выполнять действие только тогда, когда слышит ввод со сканера, и только после завершения ввода со сканера.

Это насколько я знаю (то есть, не очень): 

//Global functions: call on all pages.
$(document).ready(function() {
    // Listen for scanner input. 
    $(window).keypress(function(e) {
        var key = e.which;
        if (key==126) {.
            alert('tilde');
            // How to listen for the correct input?
            // check_out_book();
        }
    });
});

Какой лучший способ сохранить входной сигнал прослушивания в нужном мне формате?Я бы хотел послушать последние две тильды, прежде чем звонить check_out_book().

Мне бы также хотелось, чтобы после первой тильды было «остановлено» прослушивание, если есть пауза - чтобы отличить машинистку от человека и ввод от автоматического сканера.У jQuery есть способ сделать это?

Любые указатели очень ценятся!Спасибо.

Ответы [ 3 ]

8 голосов
/ 07 января 2011

Я думаю, что вы хотите сделать это, сохранив то, что вы уже получили, и проверив, действительно ли это. Если это не так, откажитесь от полученного и начните снова: 

$(document).ready(function(){
    var input = '',
        r1 = /^~{1,2}$/,
        r2 = /^~{2}\d+$/,
        r3 = /^~{2}\d+\.$/,
        r4 = /^~{2}\d+\.\d+$/,
        r5 = /^~{2}\d+\.\d+~{1}$/
        r6 = /^~{2}\d+\.\d+~{2}$/;

    $(window).keypress(function(e) {
        input += String.fromCharCode(e.which);

        if (r1.test(input) || r2.test(input) || r3.test(input) || r4.test(input) || r5.test(input)) {
            // input is valid so far, continue
        } else if (r6.test(input) {
            // input is valid and complete
            check_out_book();
        } else {
            // input is invalid, start over
            input = '';
        }
    });
});

Вы могли бы объединить все эти регулярные выражения в два, но я думаю, что это будет более разборчивым.

4 голосов
/ 12 апреля 2013

Я только что закончил писать немного javascript, который определяет, использовался ли сканер штрих-кода для заполнения поля ввода, и перемещает фокус на следующее поле, если оно было.

Мой код отвечает на часть вашего вопроса: «Я хочу настроить слушатель jQuery для ввода со сканера, и я новичок в jQuery. Он должен прослушивать весь ввод с клавиатуры, но выполнять действие только тогда, когда слышит вводот сканера и только после завершения ввода со сканера. "

Вот HTML-код для полей ввода: 

<input type="text" class="bcode" id="f1" onkeydown="typeSpeed(new Date().getTime());" onblur="typeSpeedReset();" onfocus="typeNextField('f2');" />
<input type="text" class="bcode" id="f2" onkeydown="typeSpeed(new Date().getTime());" onblur="typeSpeedReset();" onfocus="typeNextField('f3');" />
<input type="text" id="f3" />

У меня есть два поля с классом 'bcode', которые предназначеныдля ввода сканера штрих-кода (f1 и f2).Третье поле предназначено для обычного ввода (f3).Поля f1 и f2 отправляют (1) текущую метку времени при нажатии клавиши для функции 'typeSpeed' и (2) идентификатор следующего поля для выбора, когда поле получает фокус.Эти поля также инициируют вызов функции typeSpeedReset, когда поле теряет фокус.

Вот javascript / jQuery, который заставляет его работать: 

$(function(){   
    var typingTimeout;
    $('.bcode').keypress(function(e){
        if (typingTimeout != undefined) clearTimeout(typingTimeout);
        typingTimeout = setTimeout(isBarcode, 500); 
    }); 
});

var ts0 = 0, ts1 = 0, ts2, nf;

function typeSpeed(time) {
    ts0 = (ts0 == 0) ? time : 0;
    var ts3 = ts1;  
    ts1 = time - ts0;   
    ts2 = ts1 - ts3;    
}

function typeSpeedReset() { ts0 = 0; ts1 = 0; }

function typeNextField(nextfield) { nf = nextfield; }

function isBarcode() {
    if(ts2 < 20 && ts1 != 0) { $('#'+nf).focus(); }
}

Что происходит, это время между нажатиями клавишколичественно определяется функцией typeSpeed.В ходе экспериментов (потирая клавиатуру или удерживая клавишу) я обнаружил, что самый быстрый ввод данных человеком с задержкой между нажатиями клавиш составляет приблизительно ~ 33 мс.Сканер штрих-кода, который я использовал для тестирования с обычно производимыми задержками 10 мс или менее.

В поле установлен тайм-аут с классом 'bcode', чтобы определить моментальную остановку ввода.На этом этапе задержка оценивается.Если оно составляет менее 20 мс, предполагается, что использовался сканер штрих-кода, и фокусируется на следующем поле.

Проект, для которого был написан этот код, продвигается дальше, изменяя цвет фона поля иотображение небольшого графического изображения со штрих-кодом справа от поля, когда оно находится в фокусе, чтобы у пользователей было четкое представление о том, что оно реагирует и предназначено для ввода со сканера штрих-кода.

0 голосов
/ 30 июля 2017

Пожалуйста, проверьте эту ссылку , он обнаружит сканер штрих-кода, вам не нужно фокусироваться на определенном входе.

...