jQuery asynchrone funksie-oproep, geen AJAX-versoek nie

Dit lyk dom, maar ek kan nie vind hoe om 'n asynchrone funksie-oproep met jQuery uit te voer wat nie op 'n bediener-kant-versoek betrekking het nie. Ek het 'n stadige funksie wat deur baie DOM-elemente herhaal word, en ek wil hê dat die blaaier nie moet vries terwyl hierdie funksie loop nie. Ek wil 'n bietjie aanwyser vertoon voordat die stadige funksie genoem word, en wanneer die stadige funksie terugkeer, wil ek die aanwyser verberg. Ek het die volgende:

$('form#filter', parentNode).submit(function() {
  var form = $(this);
  indicator.show();
  var textField = $('input#query', form);
  var query = jQuery.trim(textField.val());
  var re = new RegExp(query, "i");
  slowFunctionCall(); // want this to happen asynchronously; all client-side
  indicator.hide();
  return false;
});

Tans stuur ek die vorm in en die aanwyser word nie vertoon nie, die blaaier vries en dan is slowFunctionCall klaar.

Wysig: Ek het gebruik Vivin se antwoord , spesifiek die Sitepoint-skakel om die volgende oplossing te kry:

var indicator = $('#tagFilter_loading', parentNode);
indicator.hide();
var spans = $('div#filterResults span', parentNode);
var textField = $('input#query', parentNode);
var timer = undefined, processor = undefined;
var i=0, limit=spans.length, busy=false;
var filterTags = function() {
  i = 0;
  if (processor) {
    clearInterval(processor);
  }
  indicator.show();
  processor = setInterval(function() {
    if (!busy) {
      busy = true;
      var query = jQuery.trim(textField.val()).toLowerCase();
      var span = $(spans[i]);
      if ('' == query) {
        span.show();
      } else {
        var tagName = span.attr('rel').toLowerCase();
        if (tagName.indexOf(query) == -1) {
          span.hide();
        }
      }
      if (++i >= limit) {
        clearInterval(processor);
        indicator.hide();
      }
      busy = false;
    }
  }, 1);
};
textField.keyup(function() {
  if (timer) {
    clearTimeout(timer);
  }
  /* Only start filtering after the user has finished typing */
  timer = setTimeout(filterTags, 2000);
});
textField.blur(filterTags);

Dit wys en verberg die aanwyser en bevries ook nie die blaaier nie. U kan sien hoe die DOM-elemente versteek word terwyl dit werk, en dit is waarvoor ek gaan.

41
задан Community 23 May 2017 в 10:30
поделиться