맞춤 유효성 하나 이상의 체크 박스가 선택되었습니다 jquery

Question

성별에 대한 두 개의 체크 박스가 있습니다. 남성과 여성. 적어도 하나의 성별에 대한 유효성을 어떻게 설정해야합니까? 월요일부터 일요일까지 일주일의 세트도 있습니다. 또한 적어도 하나의 선택 일입니다. 여기 내 JQuery와

$(document).ready(function(){ 
      // --- set required message --- // 

       var msg=""; 
       var elements = document.getElementsByTagName("INPUT"); 

       for (var i = 0; i < elements.length; i++) { 
        elements[i].oninvalid =function(e) { 
         if (!e.target.validity.valid) { 
         switch(e.target.name){        
          case 'gender' : 
           e.target.setCustomValidity("Please select at least one gender.");break;        
          case 'days' : 
           e.target.setCustomValidity("Please select at least one day.");break; 
          case 'location' : 
           e.target.setCustomValidity("Please enter a location where the image can be seen.");break; 
         default : e.target.setCustomValidity("");break; 

         } 
         } 
        }; 
        elements[i].oninput = function(e) { 
         e.target.setCustomValidity(msg); 
        }; 
       } 
      }); 



<input type=checkbox name=gender[] required>Male 
<input type=checkbox name=gender[] required>Female 

<input type=checkbox name=days[] required>Monday 
<input type=checkbox name=days[] required>Tuesday 
<input type=checkbox name=days[] required>Wednesday 
<input type=checkbox name=days[] required>Thursday 
<input type=checkbox name=days[] required>Friday 
<input type=checkbox name=days[] required>Saturday 
<input type=checkbox name=days[] required>Sunday 

Answer 1

대신 필요한 HTML5 및 유효성을 사용하는 .. 당신은이 예제를 보면

if($("input[name='gender[]']").is(":checked").length < 1){ 
// no gender selected.. 
var errmsg = $("<div class='error'>Please select at least one gender</div>"); 

} 
if($("input[name='days[]']").is(":checked").length < 1){ 
// no day selected.. 
var errmsg = $("<div class='error'>Please select at least one day</div>"); 
} 

$("containerelement").append(errmsg); 

Answer 2

if($("input[name='gender[]']:checked").length > 0){ 

} 

는 이름에 []하지만 좋아하는 경우가 트릭, 확실하지를해야합니다.

기본적으로 jquery는 성별 []이 (가) 선택된 모든 입력을 가져 오도록 지시합니다. 길이를 확인하기 만하면됩니다.

Answer 3

당신은 JQuery와에 :checked을 사용할 수 있습니다 .. 체크 박스가 체크되어 있는지 확인하기 위해 jQuery를 사용할 수 Jquery API documentation :checked

var n = $("input:checked").length; 이를 통해 jquery의 클래스 선택기를 사용하여 유효성을 검사하는 경우에 따라 입력을 적용해야 할 입력 수를 확인할 수 있습니다.