표시되는 필드의 유효성을 검사하는 방법은 무엇입니까?

Question

JQuery 유효성 검사 플러그인의 논리를 표시하여 어느 것이 표시되는지에 따라 필드의 유효성을 검사합니까? 자바 스크립트

$(document).ready(function() { 
    $('#email').hide(); 
    $('#telephone').hide(); 

    var email = false; 
    var telephone = false; 

    $('#email_button').click(function() { 
    $('#email').show(); 
    $('#telephone').hide(); 

    email = true; 
    telephone = false; 
    }); 
    $('#telephone_button').click(function() { 
    $('#telephone').show(); 
    $('#email').hide(); 

    telephone = true; 
    email = false; 
    }); 

    jQuery.validator.addMethod("phoneUS", function(phone_number, element) { 
    phone_number = phone_number.replace(/\s+/g, ""); 
    return this.optional(element) || 
     phone_number.match(/^[2-9]\d{2}-[2-9]\d{2}-\d{4}$/); 
    }, "Please specify a valid phone number"); 

    $('#new_contact').validate({ 
    ignore: ":hidden", 
    rules: { 
     'contact[name]': { 
     required: true 
     }, 
     'contact[email]': { 
     required: true, 
     email: true 
     }, 
     'contact[telephone]': { 
     required: true, 
     phoneUS: true 
     }, 
     'contact[description]': { 
     required: true 
     } 
    }, 

    messages: { 
     'contact[name]': { 
     required: "Please provide a name." 
     }, 
     'contact[telephone]': { 
     required: "Please provide a valid telephone number." 
     }, 
     'contact[description]': { 
     required: "Please provide a description of the work you would like done." 
     } 
    }, 

    errorPlacement: function(error, element) { 
     error.appendTo("#error"); 
    } 

    }); 
}); 

Answer 1

당신은이 플러그인의 속성을 무시 사용할 수 있습니다

$("#new_contact").validate({ 
    //All your options go here 
    ignore: ':hidden' 
}); 

Answer 2

<%= form_for @contact, html: { class: "form-horizontal" } do |f| %> 

    <div class="control-group"> 
    <%= f.label :name, :class => 'control-label' %> 
    <div class="controls"> 
     <%= f.text_field :name, class: 'required' %> 
    </div> 
    </div> 

    <div class="control-group"> 
    <%= f.label "How would you like to be contacted?", :class => 'control-label' %> 
    <div class="controls"> 
     <div class="btn-group" data-toggle="buttons-radio"> 
     <button class="btn" type="button" name="contact_type" id="email_button" value="email"> 
      Email 
     </button> 
     <button class="btn" type="button" name="contact_type" id="telephone_button" value="phone"> 
      Telephone 
     </button> 
     </div> 
    </div> 
    </div> 

    <div class="control-group" id="email"> 
    <%= f.label :email, :class => 'control-label' %> 
    <div class="controls"> 
     <%= f.text_field :email %> 
    </div> 
    </div> 

    <div class="control-group" id="telephone"> 
    <%= f.label :telephone, :class => 'control-label' %> 
    <div class="controls"> 
     <%= f.text_field :telephone %> 
    </div> 
    </div> 

    <div class="control-group"> 
    <div class="controls"> 
     <%= f.submit "Submit", class: "btn btn-primary" %> 
    </div> 
    </div> 
<% end %> 

표시되지 입력을 무시한다.

$("form").validate({ignore:":not(:visible)"});