jQuery timeout: e.nodeName is undefined

<script type="text/javascript">

 var delay = (function() {
     var timer = 0;
     return function(callback, ms) {
         clearTimeout(timer);
         timer = setTimeout(callback, ms);
     };
 })();

 $(function() {



     $('#activity').change(function() {
         $(this).val() == "SID" ? $('.SIDContainer').show() : $('.SIDContainer').hide();
     });

     $('.SID').keyup(function() {

     delay(function() {

         $.ajax({
             url: '../SentinelOperationsUI/GenericHandler.ashx',
             data: { 'SID': $(this).val() },
             dataType: 'json',
             success: function(data) {

                 if (data.SID != null) {
                     $('.SIDResult').text('Match: ' + ' SID: ' + data.SID);
                     console.log(data);
                 }
             }

         });

     }, 500);

     });



 });

The code works without the delay function. But i want a delay here because otherwise multiple ajax request might be sent for 开发者_JAVA百科the same value (if you type fast enough). Any idea what might be causing this? Any other solutions on this problem maybe? Thanks

Instead of using the delay, why not assign your ajax call to a variable, then check it for null with each new keyup event. Something like:

var ajaxcall;

$('.SID').keyup(function() {

    if ( ajaxcall != null ){
        ajaxcall.abort();
    }

    ajaxcall =  $.ajax({
         url: '../SentinelOperationsUI/GenericHandler.ashx',
         data: { 'SID': $(this).val() },
         dataType: 'json',
         success: function(data) {

             if (data.SID != null) {
                 $('.SIDResult').text('Match: ' + ' SID: ' + data.SID);
                 console.log(data);
             }
         }                       
    });
});

This would ensure that every keyup action would span a new ajax event and cancel any previous one.