Ben nasıl/yazı yazmayı bırakın, sonra giriş Metni olarak bir olayı tetiklemek için?

SORU

26 Aralık 2012, ÇARŞAMBA

Ben nasıl/yazı yazmayı bırakın, sonra giriş Metni olarak bir olayı tetiklemek için?

Yazarak durdurmak hemen sonra bir olay (yazmaya gerek kalmadan) benim giriş textbox karakter tetiklemek istiyorum.

Denedim:

$('input#username').keypress(function() {
    var _this = $(this); // copy of this object for further usage

    setTimeout(function() {
        $.post('/ajax/fetch', {
            type: 'username',
            value: _this.val()
        }, function(data) {
            if(!data.success) {
                // continue working
            } else {
                // throw an error
            }
        }, 'json');
    }, 3000);
});

Ama bu örnekte, her yazılan karakter için bir zaman aşımı üretir ve ben yazın 20 karakter ise 20 AJAX istekleri alıyorum.

On this fiddle Ben bir AJAX yerine basit bir uyarı ile aynı sorunu göstermek.

Bunun için bir çözüm ya da sadece bu kötü bir yaklaşım kullanıyorum var mı?

CEVAP

26 Aralık 2012, ÇARŞAMBA

setTimeout senin gibi () kullanmak zorunda da limit sıfırlama tutmak, böylece başvuru saklayın. Gibi bir şey

//
// $('#element').donetyping(callback[, timeout=1000])
// Fires callback when a user has finished typing. This is determined by the time elapsed
// since the last keystroke and timeout parameter or the blur event--whichever comes first.
//   @callback: function to be called when even triggers
//   @timeout:  (default=1000) timeout, in ms, to to wait before triggering event if not
//              caused by blur.
// Requires jQuery 1.7 
//
;(function($){
    $.fn.extend({
        donetyping: function(callback,timeout){
            timeout = timeout || 1e3; // 1 second default timeout
            var timeoutReference,
                doneTyping = function(el){
                    if (!timeoutReference) return;
                    timeoutReference = null;
                    callback.call(el);
                };
            return this.each(function(i,el){
                var $el = $(el);
                // Chrome Fix (Use keyup over keypress to detect backspace)
                // thank you @palerdot
                $el.is(':input') && $el.on('keyup keypress',function(e){
                    // This catches the backspace button in chrome, but also prevents
                    // the event from triggering too premptively. Without this line,
                    // using tab/shift tab will make the focused element fire the callback.
                    if (e.type=='keyup' && e.keyCode!=8) return;
                    
                    // Check if timeout has been set. If it has, "reset" the clock and
                    // start over again.
                    if (timeoutReference) clearTimeout(timeoutReference);
                    timeoutReference = setTimeout(function(){
                        // if we made it here, our timeout has elapsed. Fire the
                        // callback
                        doneTyping(el);
                    }, timeout);
                }).on('blur',function(){
                    // If we can, fire the event since we're leaving the field
                    doneTyping(el);
                });
            });
        }
    });
})(jQuery);

$('#example').donetyping(function(){
  $('#example-output').text('Event last fired @ '   (new Date().toUTCString()));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<input type="text" id="example" />
<p id="example-output">Nothing yet</p>

O zaman yürütülür: