폼 유효성 검사 JS - 이름 입력 필드 유효성 확인

-3

누구든지이 입력 필드의 유효성을 검사 할 수 있는지 충분히 알려줄 수 있습니까? 확인 단추가 선택 될 때까지 제출 단추는 사용 불가능합니다. 사전에 많은 감사, 나를 시작하는 데 도움이 많이 감사합니다.폼 유효성 검사 JS - 이름 입력 필드 유효성 확인

<style> 
    .textinput { 

     border: 1px solid #000; 
     border-radius: 0; 
     box-sizing: border-box; 
     color: #6c6c6c; 
     height: auto; 
     margin: 0px auto 15px auto; 
     padding: 4px 0 5px 10px; 
     width: 100%; 
     font-family: Apercuregular,sans-serif; 
     font-weight: normal; 
     letter-spacing: .02em; 
     font-size: 16px; 
     display: block; 
     width: 300px; 
} 

.form-button{ 
    background-color: #000; 
    color: #fff; 
    display: block; 
    letter-spacing: .02em; 
    font-family: Apercuregular,sans-serif; 
    font-size: 13px; 
    text-align: center; 
    text-decoration: none; 
    text-transform: uppercase; 
    padding: 1.2em 2em 1.2em 2em; 
    width: 275px; 
    margin: 25px auto 25px auto; 
    border: 1px solid #000; 
    outline: none; 
    } 
.form-button[disabled], 
.form-button[disabled]:hover { 
    background-color: #d1d3d4; 
    color: #fff; 
    border: 0 none; 
} 

.form-button:focus, 
.form-button:hover{ 
    background:#f3f3f3; 
    color:#000; 
    border: 1px solid #f3f3f3; 
    -moz-transition: all .4s ease-in-out; 
    -o-transition: all .4s ease-in-out; 
    -webkit-transition: all .4s ease-in-out; 
    transition: all .4s ease-in-out; 
} 

.fieldLabel { 
    display: block; 
    font-size: 13px; 
    font-family: Apercuregular,sans-serif; 
    letter-spacing: .02em; 
    text-align: left; 
    width: 100%; 
    line-height: 17px; 
} 

input[type="checkbox"]{ 
display: none; 
} 


input[type="email"] { 
-webkit-appearance: none; 
-moz-appearance: none; 
appearance: none; 
} 

</style> 

      <div id="container_COLUMN1"> 
       <input type="text" name="First Name" id="control_COLUMN1" label="First Name" class="textinput mandatory" placeholder="First name*" required labeltext="First name*" maxlength="50" mandatory="true"> 
      </div> 




      <div> 
       <button type="submit" class="defaultText form-button" id="submitBtn" value="Enter Now">Enter Now</button> 
      </div>

출처

2017-02-22 user3767554

JQuery와 유효성 검사 태그를 사용하지 마십시오. 편집 됨. – Sparky

그것은 당신이 찾고있는 검증 어떤 종류의 따라 달라집니다 다음은 내 코드입니다. 이름 필드이므로 공백이 아니고 글자 만 포함되도록하고 싶다고 가정합니다. 이 같은

var reg = /^[a-z]+$/i; 
var name = $('#control_COLUMN1').val(); 

if(name != '' && reg.test(name)) { 
    //name is valid 
} else { 
    //name is invalid 
}

출처

2017-02-22 13:45:08

뭔가 :

는 jQuery를 사용하면이 같은 것을 사용할 수있는 달성하기 위해. 그것은 당신이 분야의 변화 /의 keyup을 찾아 다음 다음이 0이 아닌 확인/추가 버튼의 disabled 속성을 제거하려면 값을 얻을 수있는 가장 좋은 방법

// get the text 
var inputText =document.getElementById("control_COLUMN1").value; 

// do controls 

if(controls){ 
    document.getElementById("submitBtn").hidden=false; 
}else{ 
    document.getElementById("submitBtn").hidden=true; 
}

출처

2017-02-22 13:49:44 tino

있는지 모르겠어요. 이 플러그인에 대한 요구하지 않는 한

$("#control_COLUMN1").keyup(function(event) { 
var fieldValue = event.target.value; 
if (fieldValue == 0) { 
    $("#submitBtn").attr("disabled", "disabled"); 
} else { 
    $("#submitBtn").removeAttr("disabled", "disabled"); 
}  
});

Codepin

출처

2017-02-22 13:59:13

폼 유효성 검사 JS - 이름 입력 필드 유효성 확인

답변

관련 문제