Как поместить значения отмеченных чекбоксов в адресную устроку?

Question

[IG51]

<form>
		<p><input type="checkbox" name="chbx[]" value="first">first</p>
		<p><input type="checkbox" name="chbx[]" value="second">second</p>
		<p><input type="checkbox" name="chbx[]" value="third">third</p>
		<p><input type="checkbox" name="chbx[]" value="fourth">fourth</p>
		<p><input type="checkbox" name="chbx[]" value="fifth">fifth</p>
		<button onclick="myFilter()" class="sbtn">Подобрать</button>
	</form>

Необходимо обработать отмеченные чекбоксы и поместить их через (например & или ,) в адресную строку после знака "?". Обработку сделать js, а не средствами php

Answer 1

[Дмитрий Пыркин]

примерно так

$('.sbtn').click(function(){
$('input[type="checkbox"]').each(function(){
if($(this).prop("checked")){

history.pushState(null,null,'?'+$(this).val());
}
else{

}
})
})

Answer 2

[levchak0910]

<form>
    <p><input type="checkbox" data-name="chbx" value="first">first</p>
    <p><input type="checkbox" data-name="chbx" value="second">second</p>
    <p><input type="checkbox" data-name="chbx" value="third">third</p>
    <p><input type="checkbox" data-name="chbx" value="fourth">fourth</p>
    <p><input type="checkbox" data-name="chbx" value="fifth">fifth</p>
    <input type="hidden" name="chbx">
    <button onclick="myFilter()" class="sbtn">Подобрать</button>
</form>

function myFilter() {
   var arr = [];
   document.querySelectorAll("input[data-name='chbx']:checked").forEach(input => arr.push(input.value));
   document.querySelector("input[name='chbx']").value = arr.join();
}