반응형
부트 스트랩의 폼 컨트롤 팝 오버에서 필수 필드의 기본 메시지를 변경하는 방법은 무엇입니까?
<form class="form-asd" role="form">
<h2 class="form-signin-heading">login</h2><hr />
<label class="control-label" for="username">Username</label>
<input class="form-control" type="email" required="" placeholder="username"data-error="enter valid username"></input>
<label class="control-label" for="username">password</label>
<input class="form-control" type="password" required=" " placeholder="Password"></input>
<label class="checkbox"></label>
<button class="btn btn-lg btn-primary " type="submit">submit</button>
</form>
필수 필드 "이 필드를 입력하십시오"를 "사용자 이름을 입력하십시오"로 팝업의이 기본 메시지를 어떻게 변경할 수 있습니까?
이벤트 발생시 setCustomValidity기능 을 사용할 수 있습니다 oninvalid.
아래와 같이 :-
<input class="form-control" type="email" required=""
placeholder="username" oninvalid="this.setCustomValidity('Please Enter valid email')">
</input>
최신 정보:-
입력을 시작한 후 메시지를 지우려면 oninput="setCustomValidity('')속성을 사용 하여 메시지를 지우십시오.
<input class="form-control" type="email" required="" placeholder="username"
oninvalid="this.setCustomValidity('Please Enter valid email')"
oninput="setCustomValidity('')"></input>
Mritunjay와 Bartu의 답변의 조합은이 질문에 대한 완전한 답변입니다. 전체 예제를 복사합니다.
<input class="form-control" type="email" required="" placeholder="username"
oninvalid="this.setCustomValidity('Please Enter valid email')"
oninput="setCustomValidity('')"></input>
여기,
this.setCustomValidity ( 'Please Enter valid email') " -필드가 무효화되면 사용자 지정 메시지를 표시합니다.
oninput = "setCustomValidity ( '')" -검증 된 파일에서 무효화 메시지를 제거합니다.
그리고 모든 입력에 대해 다음을 선택합니다.
$("input[required], select[required]").attr("oninvalid", "this.setCustomValidity('Required!')");
$("input[required], select[required]").attr("oninput", "setCustomValidity('')");
$ ( "input [required]"). attr ( "oninvalid", "this.setCustomValidity ( 'Say Somthing!')");
마우스로 이전 또는 다음 필드로 이동하면 작동하지만 엔터 키로는 작동하지 않습니다 !!!
반응형
'Program Club' 카테고리의 다른 글
| Salesforce 인증 실패 (0) | 2021.01.09 |
|---|---|
| ImageButton에 Ontouch와 Onclick을 모두 사용하는 방법은 무엇입니까? (0) | 2021.01.09 |
| Xcode 6.0.1이 메모리 사용량을 표시하지 않음 (0) | 2021.01.09 |
| React js의 서비스 워커 란? (0) | 2021.01.08 |
| IE8에서 호환성보기를 사용하지 * 않도록 * 강제 (0) | 2021.01.08 |