keydown에서 라벨 메시지 제거-자바 스크립트

Lucky500

빠른 질문입니다. 누군가 전화 입력 필드를 비워두면 내 레이블 메시지가 표시되지만 클릭 다운시 입력 필드로 돌아갈 때 메시지를 제거하려면 어떻게해야합니까?

function validatePhone(){
			var phone  = document.getElementById("phone1").value;
			if(phone.length === 0) {
				console.log("phone number is required.");
				producePrompt("Phone number is required.", "messagePrompt", "red");
				return false;
			} 
		}


		function producePrompt(message, promptLocation, color) {
			document.getElementById(promptLocation).innerHTML = message;
			document.getElementById(promptLocation).style.color = color;
		}
	form {
		width: 30em;
		height: 10em;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		background: #2c3e50;
	}

	form input {
		text-align: left;
		padding-left: 5px;
		margin: 0 0 10px 15px;
		position: relative;
		
		}

	form label {
		text-align: center;
	}

	#messagePrompt {
		color: red;
				
<form>
		<p>Please enter your phone number below:</p>
		<input name="phone1" id="phone1" placeholder="(000)000-0000" />
		<label for="" id="messagePrompt"></label>
		<br>
	  	<input type="button"  value="send message" onclick="validatePhone()"  />
	</form>

나는 간다

remove_msg에 ur 입력 레이블에 기능을 추가하십시오.

function validatePhone(){
			var phone  = document.getElementById("phone1").value;
			if(phone.length === 0) {
				console.log("phone number is required.");
				producePrompt("Phone number is required.", "messagePrompt", "red");
				return false;
			} 
		}


		function producePrompt(message, promptLocation, color) {
			document.getElementById(promptLocation).innerHTML = message;
			document.getElementById(promptLocation).style.color = color;
		}

function remove_msg(){
				producePrompt(" ", "messagePrompt", "red");

}
	form {
		width: 30em;
		height: 10em;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		background: #2c3e50;
	}

	form input {
		text-align: left;
		padding-left: 5px;
		margin: 0 0 10px 15px;
		position: relative;
		
		}

	form label {
		text-align: center;
	}

	#messagePrompt {
		color: red;
    }
<form>
  <p>Please enter your phone number below:</p>
  <input name="phone1" id="phone1" placeholder="(000)000-0000" onclick="remove_msg()" />
  <label for="" id="messagePrompt"></label>
  <br>
  <input type="button"  value="send message" onclick="validatePhone()"  />
</form>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

눈에 거슬리지 않는 자바 스크립트에 대한 인라인 자바 스크립트?

분류에서Dev

이벤트 루프에서 대기중인 자바 스크립트 메시지 제거

분류에서Dev

+ 서명 제거 자바 스크립트

분류에서Dev

자바 스크립트의 JSON 객체에서 라벨 검색

분류에서Dev

스플 라이스 메소드가 배열 자바 스크립트에서 항목을 제거하기 위해 변수를 허용하지 않습니다.

분류에서Dev

자바 스크립트는 디버거에서 브레이크 라인을 표시하지 않습니다

분류에서Dev

자바 스크립트를 통해 브라우저 기록에서 URL 제거

분류에서Dev

css3 애니메이션에서 자바 스크립트 제거

분류에서Dev

자바 스크립트로 반환 된 날짜 시간에서 NaN 제거

분류에서Dev

Firebase에서 개체를 제거 하시겠습니까? (자바 스크립트)

분류에서Dev

HTML 페이지에서 동적으로 자바 스크립트 제거

분류에서Dev

Servicestack API 메타 데이터 / 스웨거에서 자바 스크립트 클라이언트 생성

분류에서Dev

자바 스크립트에 CSS 클래스가 적용되지 않은 모든 HTML 요소 (라벨) 선택

분류에서Dev

몇 초 동안 메시지를 표시 한 다음 자바 스크립트에서 사라지는 방법

분류에서Dev

자바 스크립트 콘솔에서 메시지 표시

분류에서Dev

자바 스크립트 콘솔에서 메시지 표시

분류에서Dev

브라우저에서 자바 스크립트를 사용하여 메시지를 표시하는 방법

분류에서Dev

자바 스크립트의 라 라벨 웅변적인 관계 문제

분류에서Dev

자바 스크립트에서 쉼표 제거 문제

분류에서Dev

자바 스크립트로 시간이 지남에 따라 텍스트 표시

분류에서Dev

nodejs에서 전달되는 자바 스크립트 메시지

분류에서Dev

자바 스크립트 라벨 위치

분류에서Dev

자바 스크립트 라벨

분류에서Dev

자바 스크립트에서 개행 문자 제거

분류에서Dev

자바 스크립트에서 자식 요소 제거

분류에서Dev

자바 스크립트 배열에서 숫자 범위 제거

분류에서Dev

핸들러에서 자바 스크립트 제거 이벤트,

분류에서Dev

자바 스크립트에서 양식 제출 중지

분류에서Dev

자바 스크립트에서 어휘 범위 지정 해제

Related 관련 기사

  1. 1

    눈에 거슬리지 않는 자바 스크립트에 대한 인라인 자바 스크립트?

  2. 2

    이벤트 루프에서 대기중인 자바 스크립트 메시지 제거

  3. 3

    + 서명 제거 자바 스크립트

  4. 4

    자바 스크립트의 JSON 객체에서 라벨 검색

  5. 5

    스플 라이스 메소드가 배열 자바 스크립트에서 항목을 제거하기 위해 변수를 허용하지 않습니다.

  6. 6

    자바 스크립트는 디버거에서 브레이크 라인을 표시하지 않습니다

  7. 7

    자바 스크립트를 통해 브라우저 기록에서 URL 제거

  8. 8

    css3 애니메이션에서 자바 스크립트 제거

  9. 9

    자바 스크립트로 반환 된 날짜 시간에서 NaN 제거

  10. 10

    Firebase에서 개체를 제거 하시겠습니까? (자바 스크립트)

  11. 11

    HTML 페이지에서 동적으로 자바 스크립트 제거

  12. 12

    Servicestack API 메타 데이터 / 스웨거에서 자바 스크립트 클라이언트 생성

  13. 13

    자바 스크립트에 CSS 클래스가 적용되지 않은 모든 HTML 요소 (라벨) 선택

  14. 14

    몇 초 동안 메시지를 표시 한 다음 자바 스크립트에서 사라지는 방법

  15. 15

    자바 스크립트 콘솔에서 메시지 표시

  16. 16

    자바 스크립트 콘솔에서 메시지 표시

  17. 17

    브라우저에서 자바 스크립트를 사용하여 메시지를 표시하는 방법

  18. 18

    자바 스크립트의 라 라벨 웅변적인 관계 문제

  19. 19

    자바 스크립트에서 쉼표 제거 문제

  20. 20

    자바 스크립트로 시간이 지남에 따라 텍스트 표시

  21. 21

    nodejs에서 전달되는 자바 스크립트 메시지

  22. 22

    자바 스크립트 라벨 위치

  23. 23

    자바 스크립트 라벨

  24. 24

    자바 스크립트에서 개행 문자 제거

  25. 25

    자바 스크립트에서 자식 요소 제거

  26. 26

    자바 스크립트 배열에서 숫자 범위 제거

  27. 27

    핸들러에서 자바 스크립트 제거 이벤트,

  28. 28

    자바 스크립트에서 양식 제출 중지

  29. 29

    자바 스크립트에서 어휘 범위 지정 해제

뜨겁다태그

보관