HTML 필터 양식. 자바 스크립트가 하나 이상의 필드를 허용하지 않습니다.

Question

저는 카테고리 필터를 만들려고합니다. 그것은 작동하지만, 나는 복수 선택을위한 라디오 버튼이있는 다른 폼 필드를 추가하려고한다. 단, 버튼을 1 개만 선택할 수 있습니다. 첫 번째 formfield에서 radiobutton을 클릭하면 해당 버튼이 작동하지만 다른 폼의 radiobutton을 클릭하면 대신 하나를 선택할 것이므로 둘 다 선택할 수 있어야합니다. 확인란 유형 입력 비록 작동합니다. 여기

바이올린 : Fiddle

html로 :

<style>.body .item .textnoimgleftlarge {width: auto;margin: 0;padding: 0;}</style> 
<div class="filterGenius"> 
<form name="PC"> 
<table> 
<tr> 
<td colspan="3"><h3>Desktop filter</h3><br></td> 
<td></td> 
<td colspan="2"><a class="filterGeniusButton" onclick="removeFSS()">Clear all filters</a></td> 
<td></td> 
</tr> 
<tr> 
<td width="60px"><b>CPU</b></td> 
<td><label><input type="radio" name="processor" value="C2D"/><span>C2D</span></label></td> 
<td><label><input type="radio" name="processor" value="DC-"/><span>Dualcore</span></label></td> 
<td><label><input type="radio" name="processor" value="i3-"/><span>i3</span></label></td> 
<td><label><input type="radio" name="processor" value="i5-"/><span>i5</span></label></td> 
<td><label><input type="radio" name="processor" value="i7-"/><span>i7</span></label></td> 
</tr> 


<tr> 
<td width="60px"><b>Specifications</b></td> 
<td><label><input type="checkbox" name="processor" value="SSD"/><span>SSD</input></span></label>   </td> 
<td><label><input type="checkbox" name="processor" value="WLAN"/><span>WLAN</input></span> </label></td> 
<td><label><input type="checkbox" name="processor" value="W7P"/><span>W7P</input></span></td> 
<td><label><input type="checkbox" name="processor" value="W8P"/><span>W8P</input></span></td> 
</tr> 
<tr> 
<td></td> 
<td><label><input type="checkbox" name="processor" value="SFF"/><span>SFF</input></span></label> </td> 
<td><label><input type="checkbox" name="processor" value="AIO"/><span>All in one</input></span> </label></td> 
<td></td> 
<td></td> 
</tr> 
</table> 
</form> 
</div> 

자바 스크립트 :

<script> 
 
function removeFSS(){ga("send","event","button","click","filter-clear");var e=$.query.get("fss");encodeURIComponent(e).replace(/%20/g,"+");$(".filterGenius input").each(function(){var t=this;t="\\ "+$(t).val();var n=new RegExp(t,"g");e=e.replace(n,"")});var t=encodeURI(unescape($.query.set("fss",e)));var n=window.location.href.split("?")[0];window.location.href=n+t}$(document).ready(function(){$(".filterGenius input").each(function(){if(window.location.href.indexOf($(this).val())>=0){$(this).attr("checked","checked")}});$(".filterGenius input").change(function(){if($(this).is(":checked")){ga("send","event","button","click","filter-on");var e=$.query.get("fss");if(e==true){e=""}encodeURIComponent(e).replace(/%20/g,"+");var t=$(this).val();var n="%2B"+t;var r=new RegExp(n,"g");e.replace(r,"");var i=e;if($(this).is(":radio")){$(".filterGenius input[type=radio]").each(function(){var e=this;e="\\ "+$(e).val();var t=new RegExp(e,"g");i=i.replace(t,"")})}var i=i+"+"+t;var s=encodeURI(unescape($.query.set("fss",i)));$(".filterGenius input").attr("disabled",true);var o=window.location.href.split("?")[0];window.location.href=o+s}else if(!$(this).is(":checked")){ga("send","event","button","click","filter-off");var e=$.query.get("fss").toString();if(e===undefined){}else if(e=="true"){e=""}else{encodeURIComponent(e).replace(/%20/g,"+");var t=$(this).val();var n="\\ "+t;var r=new RegExp(n,"g");e=e.replace(r,"");if($(this).is(":radio")){$(".filterGenius input[type=radio]").each(function(){var t=$(this).val();var n="\\ "+t;console.log(e);console.log(n);var r=new RegExp(n,"g");e.replace(r,"");console.log("FSS RADIO: "+e)})}var i=e;var s=encodeURI(unescape($.query.set("fss",i)));$(".filterGenius input").attr("disabled",true);var o=window.location.href.split("?")[0];window.location.href=o+s}}})}) 
 
</script>

Answer 1

자바 스크립트는 문제가되지 않습니다. 당신이 설명하는 것은 라디오 버튼과 체크 박스의 예상되는 행동입니다. 라디오 버튼을 사용하면 한 번에 하나의 항목 만 선택할 수 있습니다. 컨트롤이 appropriate 인 멋진 기사가 있습니다. 라디오 버튼을 독립적으로 만들려면 다른 이름 속성을 사용해야합니다.