Ajax: wait X seconds before load

I have a search form that show live results in a specified div (look at there Filter results with Jquery)

I've modified the script a little bit and now when a user check one of the checkboxes the results div automatically refresh. The load function is handled 开发者_运维技巧by onChange event.

Is there a way to get ajax loading the result script after a specified time?

For example, if I select one checkbox the script should wait 2 seconds before load the script. In this way an user can check, for example, 2 or 3 checkboxes and when it stop to make his selection ajax will load the script.

--edit--

The ajax call for the script isn't done through a function, this is the code:

$(document).ready(function()
    {
        $('#category_filter').click(function()
        {

            var catArray = new Array();
            var j = 0;
            for(var i = 0; i < <?php echo $categories_count;?>; i++)
            {
                if(document.category_filter.filter_id[i].checked == 1)
                {
                    catArray[j] = document.category_filter.filter_id[i].value;
                    j++;
                }
            }
if(catArray[0])
            $.ajax(
            {
                type:    "POST",
                 url:     "index.php?action=ticket-search",
                data:    ({ filter: 'category',filter_id : catArray.toString() }),
                success: function(msg)
                {
                    $('#t_content').html(msg)
                                .hide()  
                                .fadeIn(700, function() {});  
                }
            });
          });
        });
      });

Try using setTimeout.

Example

setTimeout("alert('hello')",2000);

Use the setTimout function. Like so:

var timer = setTimeout(yourFunction(), 2000);

However, make sure to attach an event to clear that timeout whenever a new button is checked or else you end up firing the Ajax many times.

if(timer) { clearTimout(timer); }

var timer = setTimeout(yourFunction(), 2000);

You may use a setTimeout() call to wait a few seconds.

  var t = setTimeout(myAjaxFunction, 2000); //wait two seconds

You may need to check if a Timeout is already set if you are allowing the user to click multiple checkboxes. This is to avoid multiple AJAX calls each waiting 2 seconds. The logic will then be:

1. User Clicks
2. Is there a timeout? If yes then ignore the click
3. Else Set a timeout for the AJAX call