Steve: JQuery Alle Listenelemente per Range filtern

Hallo zusammen,

ich bin gerade dabei einen Filter zu basteln und komme einfach nicht weiter.

ich habe eine Liste:

  
<ul>  
<li>....<span class="wert">123</span></li>  
<li>....<span class="wert">234</span></li>  
<li>....<span class="wert">345</span></li>  
<li>....<span class="wert">456</span></li>  
<li>....<span class="wert">567</span></li>  
</ul>  

so weit so gut ;-)

nun will ich jedes listenelement durchgehen und prüfen ob der wert innerhalb oder ausserhalb eines Ranges liegt.

z.B Range 300-500
=> die Listenpunkte innerhalb des Ranges, also zu wert 345 + 456 sollten per addClass eine neue Klasse erhalten...

Kann mir hier evtl jemand einen Tipp geben, wie man das am einfachsten und vor allem performantesten löst?

Danke im Voraus!!!!

  1. Hi,

    nun will ich jedes listenelement durchgehen und prüfen ob der wert innerhalb oder ausserhalb eines Ranges liegt.

    z.B Range 300-500
    => die Listenpunkte innerhalb des Ranges, also zu wert 345 + 456 sollten per addClass eine neue Klasse erhalten...

    Kann mir hier evtl jemand einen Tipp geben, wie man das am einfachsten und vor allem performantesten löst?

    Hast du wenigstens einen eigenen Ansatz?

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    1. is jetzt bin ich so weit:

        
      <ul>  
      <li>....<span class="wert">123</span></li>  
      <li>....<span class="wert">234</span></li>  
      <li>....<span class="wert">345</span></li>  
      <li>....<span class="wert">456</span></li>  
      <li>....<span class="wert">567</span></li>  
      </ul>  
      
      
        
      	  
      var min = 300;  
      var max = 500;  
      $("#liste > li").each(function(){  
      	value = this.????  
      	if (value > min && value < max){  
      	//TODO  
      	}  
      });  
      
      

      mein problem ist jetzt an den Wert von "#liste > li span.preis" zu kommen... dann sollte es gehen oder? die Frage ist auch ob es evtl auch schneller geht??

      Hi,

      nun will ich jedes listenelement durchgehen und prüfen ob der wert innerhalb oder ausserhalb eines Ranges liegt.

      z.B Range 300-500
      => die Listenpunkte innerhalb des Ranges, also zu wert 345 + 456 sollten per addClass eine neue Klasse erhalten...

      Kann mir hier evtl jemand einen Tipp geben, wie man das am einfachsten und vor allem performantesten löst?

      Hast du wenigstens einen eigenen Ansatz?

      MfG ChrisB

      1. Hallo,

        mein problem ist jetzt an den Wert von "#liste > li span.preis" zu kommen...

        Kindelement finden: http://api.jquery.com/find
        Dessen Inhalt auslesen: http://api.jquery.com/text

        die Frage ist auch ob es evtl auch schneller geht??

        Wenn du die Filterung mehrfach vornimmst, kann es sinnvoll sein, im Script eine Cache-Liste anzulegen, welches jeweils das li-Element und den Wert als Zahl enthält. Das kann das Vergleichen der Werte beschleunigen. Allerdings muss dann immer noch jedes Element ein- und ausgeblendet werden. Vielleicht hilft dir auch dieser Thread weiter.

        Mathias

        1. Hi Mathias,
          danke für die Antwort, aber das war mir leider shcon alles klar....

          mir gehts darum:

            
            
          var min = 300;  
          var max = 500;  
          $("#liste > li").each(function(){  
                  value = this.????  
                  if (value > min && value < max){  
                  //TODO  
                  }  
          });  
            
          
          

          wie kann ich in der function nach "each" aut das entsprechende li zugreifen?
          irgendwas passt da nicht.
          mir komtms grad so vor, als wenn der im Each gar nicht alle LIs durchläuft?

          Denkfehler bei mir???
          THX

          "this"? oder wie

          Hallo,

          mein problem ist jetzt an den Wert von "#liste > li span.preis" zu kommen...

          Kindelement finden: http://api.jquery.com/find
          Dessen Inhalt auslesen: http://api.jquery.com/text

          die Frage ist auch ob es evtl auch schneller geht??

          Wenn du die Filterung mehrfach vornimmst, kann es sinnvoll sein, im Script eine Cache-Liste anzulegen, welches jeweils das li-Element und den Wert als Zahl enthält. Das kann das Vergleichen der Werte beschleunigen. Allerdings muss dann immer noch jedes Element ein- und ausgeblendet werden. Vielleicht hilft dir auch dieser Thread weiter.

          Mathias

          1. Hi,

            bitte zitiere nicht immer alles, sondern nur das, worauf du dich konkret beziehst, danke.

            wie kann ich in der function nach "each" aut das entsprechende li zugreifen?

            $(this) sollte das tun.

            mir komtms grad so vor, als wenn der im Each gar nicht alle LIs durchläuft?

            „Kommt mir so vor“ ist keine Aussage, mit der sich irgendwas anfangen lässt. Betreibe sinnvolles Debugging. Lass dir bspw. das jeweils aktuelle Objekt auf der Konsole ausgeben (Stichworte: Firebug, console.log())

            MfG ChrisB

            --
            RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
          2. danke für die Antwort, aber das war mir leider shcon alles klar....

            Wenn dir bewusst ist, wo du die jQuery-API-Dokumentation findest, so kennst du sicher auch:

            wie kann ich in der function nach "each" aut das entsprechende li zugreifen?

            http://api.jquery.com/each
            … welches deine Frage beantworten sollte.

            Mathias

  2. @@Steve:

    nuqneH

    ich habe eine Liste:

    <ul>
    <li>....<span class="wert">123</span></li>
    <li>....<span class="wert">234</span></li>
    <li>....<span class="wert">345</span></li>
    <li>....<span class="wert">456</span></li>
    <li>....<span class="wert">567</span></li>
    </ul>

    
    >   
    > so weit so gut ;-)  
      
    So weit, so schlecht.  
      
    Du missbrauchst das @class-Attribut, um Werte unterzubringen. Warum stehen die nicht im Elementinhalt?  
      
    ~~~html
    <ul>  
      <li>…<span>123</span></li>  
      <li>…<span>234</span></li>  
      …  
    </ul>
    

    Ansonsten hält HTML5 dafür @data-*-Attribute bereit:

    <ul>  
      <li><span data-wert="123"></span></li>  
      <li><span data-wert="234"></span></li></ul>
    

    oder eher besser

    <ul>  
      <li data-wert="123"></li>  
      <li data-wert="234"></li></ul>
    

    Was bezweckst du mit den Werten anzustellen?

    Qapla'

    --
    Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
    (Mark Twain)
    1. [latex]Mae  govannen![/latex]

      ich habe eine Liste:

      <ul>
      <li>....<span class="wert">123</span></li>
      <li>....<span class="wert">234</span></li>
      <li>....<span class="wert">345</span></li>
      <li>....<span class="wert">456</span></li>
      <li>....<span class="wert">567</span></li>
      </ul>

      
      > >   
      > > so weit so gut ;-)  
      >   
      > So weit, so schlecht.  
      >   
      > Du missbrauchst das @class-Attribut, um Werte unterzubringen. Warum stehen die nicht im Elementinhalt?  
        
      Schon mal bei Fielmann gewesen?  
        
      Ansonsten: Das oben halte ich für durchaus sinnvolles HTML, falls man nicht HTML5 verwendet. Jedenfalls fällt mir jetzt nichts ein, was man, ggf. von Kleinigkeiten abgesehen, anders machen müßte oder sollte.  
        
      Stur lächeln und winken, Männer!  
      Kai
      
      -- 
      Dank Hixies Idiotenbande geschieht grade eben wieder ein Umdenken  
      in Richtung "Mess up the Web".([suit](https://forum.selfhtml.org/?t=197497&m=1324775))  
      [SelfHTML-Forum-Stylesheet](http://selfhtml.knrs.de/#h_stylesheet)
      
      1. @@Kai345:

        nuqneH

        Schon mal bei Fielmann gewesen?

        Hm, ja. Vielleicht sollte ich zu einem anderen Optiker gehen? ;-)

        Qapla'

        --
        Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
        (Mark Twain)