Gibt es eine Möglichkeit, den Checkbox-Status von .html()

Question

Ich versuche, history.pushState mit einer Ajax-Suche zu verwenden, aber es ist nicht speichern Checkbox-Status.

Dies ist ein Beispiel dafür, wie ich das Formular an die pushstate speichere:

history.pushState({ FilterSearch: container.html() }, 'search', formAction); 

Wo container ist die Form mit Kontrollkästchen und Ergebnisse und formAction ist die URL. Dies wird bei Änderung der Checkbox (im Ergebnis des Ajax Calls) aufgerufen.

Ich glaube, das Problem ist, dass .html scheint nicht den aktualisierten Status der Checkbox zu bekommen - siehe das Schnipsel unten.

$('#test1').on('change', function() { 
 
\t console.log($('#test').html()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="test"> 
 
    <input type="checkbox" id="test1" value="test"> 
 
</div>

Wenn Sie an der Konsole aussehen, wie Sie die Eingabe überprüfen und deaktivieren, können Sie es sehen nie das checked Attribut muss hinzugefügt werden.

Gibt es trotzdem, dass der Pushstate sich an den Status der Checkboxen erinnert?

Answer 1

Dank der Kommentare von Adrenaline-DJ und Jai für den Hinweis mich in die richtige Richtung. Ich konnte das Attribut setzen und dann .html rufen Sie wie folgt vor:

$('#test1').on('change', function() { 
 
    if (this.checked) { 
 
     $(this).attr('checked', true); 
 
    } else { 
 
     $(this).removeAttr('checked'); 
 
    } 
 
    console.log($('#test').html()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="test"> 
 
    <input type="checkbox" id="test1" value="test"> 
 
</div>

Answer 2

können Sie überprüfen, ob ein Kontrollkästchen aktiviert ist oder nicht durch .is(':checked') verwendet, gibt es wahr oder falsch

$('#test1').on('change', function() { 
 
\t console.log($('#test1').is(':checked')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="test"> 
 
    <input type="checkbox" id="test1" value="test"> 
 
</div>