Jquery 사용자 지정 유효성 검사 메시지

jquery에서 연락처 양식을 만들고 있지만 사용자 정의 유효성 검사 메시지를 표시하는 데 어려움이 있습니다. 그것은 단지 작은 팝업 메시지를 보여줍니다 : "양식을 작성 해주십시오."그리고 내가 지정한 커스텀 메시지가 아닙니다. 유효성 검사 플러그인의 다른 버전을 시도했는데 작동하지 않았습니다. 같은 결과로 여러 자습서를 따랐습니다. 당신 중 일부는 올바른 경로에 나를 넣을 수 있을까요?Jquery 사용자 지정 유효성 검사 메시지

JQuery와

$(document).ready(function() { 
$('#contact_form').validate({ 
    rules: { 
     name: { 
      required: true 
     } 
    }, 
    messages: { 
     name: { 
      required: "come on, you have a name don't you?" 
     } 
    }, 
    submitHandler: function (form) { 
     $(form).ajxSubmit({ 
      type: "POST", 
      data: $(form).serialize(), 
      url: "", 
      success: function() { 
       $('#contact_form :input').attr('disabled', 'disabled'); 
       $('#contact_form').fadeTo("slow", 0.15, function() { 
        $(this).find(':input').attr('disabled', 'disabled'); 
        $(this).find('label').css('cursor', 'default'); 
        $('#success').fadeIn(); 
       }); 
      }, 
      error: function() { 
       $('#contact_form').fadeTo("slow", 0.15, function() { 
        $('#error').fadeIn(); 
       }); 
      } 
     }); 
    } 
}); 
});

HTML 코드 아래

<form method="post" name="contact" id="contact_form"> 
        <div class="row uniform collapse-at-2"> 
         <div class="6u"> 
          <input type="text" name="name" id="name" placeholder="Name" required="" /> 
         </div> 
         <div class="6u"> 
          <input type="email" name="email" id="email" placeholder="Email" required="" /> 
         </div> 
        </div> 
        <div class="row uniform"> 
         <div class="12u"> 
          <input type="text" name="subject" id="subject" placeholder="Subject" required="" /> 
         </div> 
        </div> 
        <div class="row uniform"> 
         <div class="12u"> 
          <textarea name="message" id="message" placeholder="Message" rows="6" required=""></textarea> 
         </div> 
        </div> 
        <div class="row uniform"> 
         <div class="12u"> 
          <ul class="actions"> 
           <li> 
            <input type="submit" class="special" value="Send Message" id="submit" name="submit" /> 
           </li> 
           <li> 
            <input type="reset" name="reset" id="reset" value="Reset Form" /></li> 
          </ul> 
         </div> 
        </div> 
       </form>

출처

2014-10-28 Nicolas Pierre

jquery 유효성 검사 플러그인을 사용하고 있습니까? –

내가 진술 한 것처럼 .. –

보이지 않습니까? '어서, 너 이름이있어?'? –

나를 위해 좋은 것 같다. 모든 종속 라이브러리 (예 : 자동 완성 또는 기타 플러그인의 경우) 전에 jQuery 기본 라이브러리를 포함했는지 확인하십시오.

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<title>jQuery Autocomplete</title> 
<meta charset="utf-8"> 
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.11.1/jquery.validate.min.js"></script> 

<script> 

$(document).ready(function() { 
$('#contact_form').validate({ 
    rules: { 
     name: { 
      required: true 
     } 
    }, 
    messages: { 
     name: { 
      required: "come on, you have a name don't you?" 
     } 
    }, 
    submitHandler: function (form) { 
     $(form).ajxSubmit({ 
      type: "POST", 
      data: $(form).serialize(), 
      url: "", 
      success: function() { 
       $('#contact_form :input').attr('disabled', 'disabled'); 
       $('#contact_form').fadeTo("slow", 0.15, function() { 
        $(this).find(':input').attr('disabled', 'disabled'); 
        $(this).find('label').css('cursor', 'default'); 
        $('#success').fadeIn(); 
       }); 
      }, 
      error: function() { 
       $('#contact_form').fadeTo("slow", 0.15, function() { 
        $('#error').fadeIn(); 
       }); 
      } 
     }); 
    } 
}); 
}); 

</script> 
</head> 

<body> 

<form method="post" name="contact" id="contact_form"> 
        <div class="row uniform collapse-at-2"> 
         <div class="6u"> 
          <input type="text" name="name" id="name" placeholder="Name" required="" /> 
         </div> 
         <div class="6u"> 
          <input type="email" name="email" id="email" placeholder="Email" required="" /> 
         </div> 
        </div> 
        <div class="row uniform"> 
         <div class="12u"> 
          <input type="text" name="subject" id="subject" placeholder="Subject" required="" /> 
         </div> 
        </div> 
        <div class="row uniform"> 
         <div class="12u"> 
          <textarea name="message" id="message" placeholder="Message" rows="6" required=""></textarea> 
         </div> 
        </div> 
        <div class="row uniform"> 
         <div class="12u"> 
          <ul class="actions"> 
           <li> 
            <input type="submit" class="special" value="Send Message" id="submit" name="submit" /> 
           </li> 
           <li> 
            <input type="reset" name="reset" id="reset" value="Reset Form" /></li> 
          </ul> 
         </div> 
        </div> 
       </form> 
</body> 
</html>

출처

2014-10-28 11:24:10

별도의 파일을 사용할 때 왜 작동하지 않습니까? –

별도의 파일을 의미합니까? –

절대 신경 쓰지 마라. –

Jquery 사용자 지정 유효성 검사 메시지

답변

관련 문제