jQuery Validate pluginjQuery Validate Plugin 시작하기


비고

이 섹션에서는 jquery-validate가 무엇인지, 그리고 왜 개발자가 jquery-validate를 사용하고자하는지에 대한 개요를 제공합니다.

또한 jquery-validate 내의 큰 주제를 언급하고 관련 주제에 링크해야합니다. jquery-validate에 대한 문서가 새롭기 때문에 이러한 관련 항목의 초기 버전을 만들어야 할 수도 있습니다.

설치 또는 설정

jQuery를 포함시킨 후 CDN 또는 로컬에서 플러그인을 포함하십시오. 그런 다음 폼에 .validate() 메서드를 연결하여 플러그인을 초기화합니다. 이 방법에서는 규칙, 사용자 정의 메시지 및 기타 옵션을 정의 할 수 있습니다.

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/jquery.validate.js"></script>
<script>
    $(document).ready(function() {  // <-- ensure form's HTML is ready
    
        $("#myform").validate({  // <-- initialize plugin on the form.
            // your rules and other options,
            rules: {
                first_name: {  // <-- this is the name attribute, NOT id
                    required: true
                },
                last_name: {
                    required: true
                },
                phone: {
                    required: true,
                    digits: true
                }
            }
        });
    
    });
</script>
 

유효성 검사를 위해 고려되는 모든 입력에는 고유 한 name 속성이 있어야합니다. 이것은 플러그인이 입력을 추적하는 방법입니다. 해당 HTML 마크 업 :

<form id="myform">
    <input type="text" name="first_name" /><br/>
    <input type="text" name="last_name" /><br/>
    <input type="text" name="phone" /><br/>
    <input type="submit" />
</form>