Klasse zu Körper hinzufügen, wenn sich URL mit Jquery ändert?

Question

Ich verwende ein Plugin in Ajax, die einige Produkte meiner Website filtern. Die URL ändert sich, ohne die Seite neu zu laden.

Ich muss die URL identifizieren, teilen Sie die Wörter und fügen Sie diese Klasse zu Körper.

EG: Ich habe einige Produkte filtert, dann https://website.com/size=big/color=yellow,green,dark-red meine url Änderungen So würden diese Klassen Körper hinzugefügt werden: Größe groß Farbe

grün dunkelrote gelb ich diesen Code, aber ich weiß nicht, wie man es macht.

$(window).on('hashchange', function(e){ 
     $('body'). 
}); 

Danke.

Answer 1

UPDATE: Basierend auf dem Kommentar-Thread in meiner Antwort scheint es, dass Sie wirklich versuchen, die Querystring-Werte in CSS-Klassennamen zu konvertieren.

Sie können window.location.search verwenden, um auf alle Abfragezeichenfolgenparameter zuzugreifen.

function updateBodyClasses() { 

    var classNames = []; 

    // Use `.split()` to separate each key/value pair in the query by `&` 
    window.location.search.split('&') 
    // and loop over the results 
    .forEach(function(c) { 

     // Now split each pair by '=' 
     var pair = c.split['=']; 

     // Add the value to the left of the '=' 
     if (pair.length > 0) { 
     classNames.push(pair[0]); 

     // if there are values on the right of the '='... 
     if (pair.length > 1) { 

      // ... split them by ',' and loop through them 
      pair[1].split(',').forEach(function(t) { 
      classNames.push(t); 
      });  
     } 
     } 
    }); 

    // Now append those classNames to the body 
    $('body').addClass(classNames.join(' ')); 
} 

// If your ajax plugin modifies the url via HTML5 history api... 
$(window).on('popstate', updateBodyClasses); 


// Update classes on page load 
$(window).on('load', updateBodyClasses); 

// If the ajax plugin modifies the url using window.location.replace() 
// you'll need to check on an interval whether things have changed 
// and update accordingly. the following example does this every 1000 milliseconds (or every second) 

setInterval(updateBodyClasses, 1000);