0

我有一个html输入，

<input type="text" id="txtCheckoutBCode" name="barcode" class="sfInputbox" />

现在我想在条形码阅读器读取条形码的同时触发一些 ajax 调用，并且条形码反映在上面的文本字段中。

我尝试了以下代码，

$('#txtCheckoutBCode').on('change', function() {
    var me= $(this);
    var number = 0;
    number = $.trim(me.val());                        
    if (number.length == 12) { // 12 coz my barcode is of length 12
        //ajaxcall method
    }
});

但仅在焦点从输入字段更改时触发。还 ，

 $('#txtCheckoutBCode').on('keyup', function() {
     var me= $(this);
     var number = 0;
     number = $.trim(me.val());                        
     if (number.length == 12) { //12 coz my barcode is of length 12
         //ajax call method
     }
 });

这会触发 ajax 调用两次，我不喜欢这样。

输入字段填满条形码后，我需要立即调用 ajax 代码。但不是两次。

4

2 回答 2

1

首先，您应该使用propertychange keyup input paste代替，keyup以确保检测到与您的输入的任何交互（例如粘贴）。但它可能会触发该事件两次，尤其是在 Firefox 中。我建议keyup paste只使用。

change，如您所说，将在输入失去焦点时触发。 keyup每次按键都会触发。

如果您希望仅执行一次 ajax 调用，请尝试使用stopImmediatePropagation()：

$('#txtCheckoutBCode').on('keyup paste', function(e) {
    e.stopImmediatePropagation();
    var me= $(this);
    var number = 0;
    number = $.trim(me.val());                        
    if (number.length == 12) { // 12 coz my barcode is of length 12
        //ajaxcall method
    }
});

http://jsfiddle.net/fC5yh/

于 2013-11-08T10:18:08.907 回答
-1

将 keyup 更改为 keypress 

<script type="text/javascript" >
$(function() {            
$('#txtCheckoutBCode').on('keypress', function() {

                var self = $(this);
                var number = 0;
                number = $.trim(self.val());                        
                    if (number.length == 12) { //12 coz my barcode is of length 12
                        //ajax call method              
                    }
            });

});
</script>                       
<input type="text" id="txtCheckoutBCode" name="barcode" class="sfInputbox" />
于 2013-11-08T10:32:49.887 回答