jquery Selektor: Erkennung abweichende Klasse

Question

hier ist mein Markup:

<div class='seat'></div> 
<div class='seat marked'></div> 
<div class='seat marked'></div> 
<div class='seat marked'></div> 
<div class='seat'></div> 
<div class='seat marked'></div> 
<div class='seat'></div> 
<div class='seat'></div> 

als einfache binäre optische Übersetzung sein würde: -xxx-x--

Ich will, was ist, wenn die Gruppe bestimmen/Der Bereich der Elemente, die die Klasse "markiert" enthalten, hat eine Lücke von mindestens einem Element, das keine Klasse "markiert" hat. irgendwelche Ideen, die der beste Ansatz wäre?

dank

Answer 1

Wenn Sie nur zu prüfen, versuchen, wenn es eine Lücke ist, können Sie wie folgt vorgehen:

$('.marked').nextUntil(":not(.marked)").length == ($('.marked').length - 1) 

nextUntil würden Sie tatsächlich die Elemente in der Reihenfolge geben, während .marked von dem Wähler ohne mit :not Betreiber.

Beispiel: https://jsfiddle.net/bneen5rc/2/

Wenn Sie das Element zu finden versuchen:

var matchFound = false; 
var firstInstance = false; 
$('div').each(function() 
{ 
    if($(this).hasClass('marked') && $(this).hasClass('seat')) 
    { 
     matchFound = true; 
     firstInstance = true; 
    } 
    else 
    matchFound = false; 

    if(!matchFound && firstInstance) 
    { 
     console.log("marked sequence changed"); 
     return false; 
    } 

}); 

Beispiel: https://jsfiddle.net/bneen5rc/3/

Answer 2

Wenn ich Ihre Frage richtig verstehen, dann glaube ich, Sie versuchen, einen Platz zu bauen Selektor, auf diese Weise mein Vorschlag wird sein, jquery oder Javascript zu verwenden, um den Job zu tun. Wie Zuweisen eines „id“ für jeweils mit den Zahlen, und verwenden Sie OnMouseClick eine JavaScript-Funktion, um zB zu nennen: -

<div id="1" class='seat' onmouseClick="javascript:toggleMarkVal('1');"></div> 
<div id="2" class='seat marked' onmouseClick="javascript:toggleMarkVal('2');"></div> 
<div id="3" class='seat marked' onmouseClick="javascript:toggleMarkVal('3');"></div> 
<div id="4" class='seat marked' onmouseClick="javascript:toggleMarkVal('4');"></div> 
<div id="5" class='seat' onmouseClick="javascript:toggleMarkVal('5');"></div> 
<div id="6" class='seat marked' onmouseClick="javascript:toggleMarkVal('6');"></div> 
<div id="7" class='seat' onmouseClick="javascript:toggleMarkVal('7');"></div> 
<div id="8" class='seat' onmouseClick="javascript:toggleMarkVal('8');"></div> 

jetzt in jQuery u kann eine Funktion erstellen, die alle Sitznummern und innerhalb der Funktion zu erhalten du kannst ein Array erstellen (abhängig von der Anzahl der Zeilen {du kannst damit spielen} Anzahl der Dimensionen erstellen) in meinem Fall denke ich an eine 2 Zeile 4 Spalte

Wenn du willst, dass ich das Skript für jquery schreibe bitte Post mir, ich werde.

Meine Entschuldigung, wenn ich irgendwelche Fehler gemacht habe, kann jeder fühlen, um es zu korrigieren, der obige Vorschlag wurde aus meiner eigenen Erfahrung genommen.

Dank & Grüße Nair