자바스크립트는 세 종류의 다이얼로그 박스를 제공합니다. 어떤 것들이 있는지 한번 볼까요??
사용자에게 경고메시지를 보여줄 때 사용하는 박스죠. 필수값을 입력하지 않고 진행하려는 사용자에게 경고를 할 때 주로 사용합니다.
<head>
<script type="text/javascript">
<!--
alert("Warning Message");
//-->
</script>
</head>
|
경고창은 OK버튼 하나만 가지고 있습니다. 뭔가를 알려주고 알겠다는 말을 해주고 사용자가 그 말을 확인했다는 확인버튼만 있는거죠.
확인창은 사용자에게 정말 실행하겠습니까? 와 같은 질문을 하고 확인을 하기 위해서 사용됩니다.그래서 버튼이 두개가 있죠. 확인버튼과 취소버튼이요.
사용자가 확인버튼을 누르면 confirm() 메소드는 참을 반환하고 취소버튼을 누르면 거짓을 반환합니다.그리고 거기에 따라서 어떠한 로직을 태울지는 개발자가 결정하면 되는거죠.
<head>
<script type="text/javascript">
<!--
var retVal = confirm("Do you want to continue ?");
if( retVal == true ){
alert("User wants to continue!");
return true;
}else{
alert("User does not want to continue!");
return false;
}
//-->
</script>
</head>
|
프롬프트 창은 사용자로부터 어떤 입력을 받을 수 있는 창입니다. prompt() 메소드를 사용하며 두개의 파라미터를 받습니다. 프롬프트창의 라벨과 창에 표시될 텍스트. 역시 버튼은 확인과 취소 두개의 버튼이 있습니다. 확인버튼을 누르면 prompt() 메소드는 입력된 값을 반환하고 취소버튼을 누르면 null을 반환합니다.
<head>
<script type="text/javascript">
<!--
var retVal = prompt("Enter your name : ", "your name here");
alert("You have entered : " + retVal );
//-->
</script>
</head>
|
직접 테스트 해보세요. 연습은 10번씩 해야 손에 익고 눈에 익고 실력으로 남습니다.
Reference : http://www.tutorialspoint.com/javascript/javascript_dialog_boxes.htm
| [Javascript / 자바스크립트] 강좌 #16 - Object ( 객체 ) (0) | 2015.08.05 |
|---|---|
| [Javascript / 자바스크립트] 강좌 #15 - void 키워드 (0) | 2015.08.05 |
| [Javascript / 자바스크립트] 강좌 #13 - Page Redirection ( 페이지 리디렉션 ) (0) | 2015.08.05 |
| [Javascript / 자바스크립트] 강좌 #12 - Cookie handling ( 쿠키 핸들링 ) (0) | 2015.08.05 |
| [Javascript / 자바스크립트] 강좌 #11 - Event Handling ( 이벤트 처리 ) (0) | 2015.08.05 |