Stefan: große Listen live perJS/JQuery filtern

Beitrag lesen

Hallo zusammen,

ich möchte meinen WebShop um einen Livefilter in den Kategorien erweitern.
Eine Kategorie hat von 2- 1000 Artikel, die allesamt in einer Liste angezeigt werden.
Nun möchte ich diese Liste auf Bezeichnung filtern und später auch noch einen Preisfilter einbauen.
Aber irgendwie bin ich auf dem Holzweg. Meine Lösung funktioniert für den Filter ebreits, bei mehr als 300 Artikeln stirbt aber der Browser komplett ab.

Hat mir hier evtl jemand einen Tipp/Trick wie ich das Ganze besser lösen kann?

Danke im Voraus.
Hier mein jetziger JS Code:

  
  
(function ($) {  
  jQuery.expr[':'].Contains = function(a,i,m){  
      return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;  
  };  
  
  
  function listFilter(header, list) {  
    var form = $("<form>").attr({"class":"filterform","action":"#"}),  
        input = $("<input>").attr({"class":"filterinput","type":"text"});  
  
    $(form).append(input);  
	$(form).appendTo(header);  
	  
    $(input).change( function () {  
        var filter = $(this).val();  
		<?php  
			/*  
			 * TODO mehrere Filter + Preis per Slider  
			 *  
			 */  
			?>  
        if(filter.length > 3) {  
			$(list).find("li").hide();  
			$(list).find("div.suchfilter:Contains(" + filter + ")").parent().slideDown();  
        } else {  
          $(list).find("li").slideDown();  
        }  
        return false;  
      }).keyup( function () {  
        $(this).change();  
    });  
  }  
  
  
  $(function () {  
  
    listFilter($("#artikelliste_filter"), $("#artikelliste"));  
  });  
}(jQuery));