自定義有效性至少選中一個複選框jquery

我有兩個性別複選框。男性和女性。我應該如何爲至少一個性別設置我的驗證。從星期一到星期日，我還有一週的時間。這也是至少有一天的選擇。這裏是我的jQuery自定義有效性至少選中一個複選框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

來源

2014-06-23 Vincent

性別不是一個廣播組更可能，雖然現在adays誰知道..;] – webkit

@webkit是的，我知道。但在我的網絡上。有一個選擇，男性只能看到和女性。或者可以是兩者。所以我做了一個複選框，以便可以選擇性別。與哪天可以查看的日期相同 – Vincent

而不是使用所需的HTML5和有效性。您可以只使用jQuery來看看一個複選框被選中..

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);

來源

2014-06-23 09:19:16 webkit

我是否仍然可以從html5中爲此設置消息？ – Vincent

當然，只要使用普通的錯誤文本，並將其插入到你想要的元素。 – webkit

好的，我會試試這個。 – Vincent

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

}

這應該做的伎倆，不知道這是否喜歡[]的名稱雖然。

基本上告訴jquery獲取所有的輸入與已選擇的性別[]名稱。你所要做的就是檢查長度。

來源

2014-06-23 09:17:04

您可以在jQuery中使用:checked看看這個例子Jquery API documentation :checked

var n = $("input:checked").length;有了這個，你可以檢查知道你想要輸入的數量，你將不得不根據你正在驗證的情況下使用輸入，在jquery中使用類選擇器。

來源

2014-06-23 09:20:02 manuel

自定義有效性至少選中一個複選框jquery

回答

相關問題