<!DOCTYPE html>
<html>
<head>
<title>::: 12_form 입력데이터 확인하기 :::</title>
<script type="text/javascript">
// 회원아이디 및 패스워드 입력 확인
// 입력 확인 후 전송하기
function goLogin(){
var fm = document.getElementById("fm");
// 회원 아이디 입력 여부 확인하기
if(fm.mem_id.value == ""){
alert("아이디를 입력해 주세요");
// focus() 해당 입력 박스로 커서를 이동함
fm.mem_id.focus();
return;
}
if(fm.mem_pw.value == ""){
alert("패스워드를 입력해 주세요");
fm.mem_pw.focus();
return;
}
alert(fm.mem_id.value);
alert(fm.mem_pw.value);
// 이동할 페이지 정의(즉, 요청페이지 정의)
fm.action = "./11_javascript.html";
// 전송해주세요...처리
fm.submit();
}
</script>
</head>
<body>
<!--
[form] 태그의 역할
- form 태그 영역 안에 있는 name이 있는 입력값들을
서버로 전송하는 기능을 수행함
- form태그 속성으로는 요청방식, 요청페이지 등을 지정할
수 있는 속성이 있음
- 요청방식 : method -> post 와 get 방식이 있음
- 요청페이지 정의 : action 속성에 정의
-->
<form name="fm" id="fm" action="./11_javascript.html">
아이디 :
<input type="text" name="mem_id" id="mem_id"
placeholder="아이디를 입력해주세요!"
required>
<br/>
패스워드 :
<input type="password" name="mem_pw" id="mem_pw"
placeholder="패스워드를 입력해주세요!"
required>
<hr/>
<button onclick="goLogin()">로그인</button>
<!-- required를 사용하는 경우 -->
<input type="submit" value="로그인(required)">
</form>
</body>
</html>
'Javascript' 카테고리의 다른 글
| 14. Javascript_jquery_toggle (0) | 2023.03.08 |
|---|---|
| 13. Javascript_jquery (0) | 2023.03.08 |
| 11. Javascript_goReplace, 배열 만들기, 화면 초기화 기 (0) | 2023.03.06 |
| 10. Javascript_특정 위치의 문자 추출하기(goSlice, goSubstring, goSubstr) (0) | 2023.03.06 |
| 09. Javascript_문자열 길이확인, 특정찾기 (0) | 2023.03.06 |
