javascript 라이브러리 중 가장 많이 사용되는 jQuery
jQuery 다운로드
$() ->> $제이쿼리 표시 // ${} ->> EL임 헷갈리지말기!!
=====================================
<script type="text/javascript">
function checkUser(){
if(document.userInsertForm.name.value=="")
alert("이름을 입력하세요");
else if(document.userInsertForm.id.value=="")
alert("아이디를 입력하세요");
else if(document.userInsertForm.pwd.value=="")
alert("비밀번호를 입력하세요");
else
document.userInsertForm.submit();
}
</script>
================================위에 내용을 아래로 바꾸기
</script><script type="text/javascript" src="http://code.jquery.com/jquery-3.2.1.min.js"></script> // 기본 기능만있는 주소임<script type="text/javascript">
$(document).ready(function(){});
</script>
=========================================================
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
$(document).ready(function(){
if($('#name').val()=='')
$('#nameDiv').text("이름입력").css("color","red").css("font-size","8pt");
if($('#id').val()=='')
$('#idDiv').text("아이디입력").css("color","black").css("font-size","8pt");
if($('#pwd').val()=='')
$('#pwdDiv').text("비번입력").css("color","black").css("font-size","8pt");
});
</script>
</head>
<body>
<form name="userInsertForm" action="/Chapter06_DynamicSpringMaven/user/userInsert.do" method="POST">
<table border="1" cellpadding="3" cellspacing="0">
<tr>
<td align="center"> 이름</td>
<td><input type="text" id="name" ><br>
<div id="nameDiv" ></div>
</td>
</tr>
<tr>
<td align="center"> 아이디</td>
<td><input type="text" id="id"><br>
<div id="idDiv" ></div></td>
</tr>
<tr>
<td align="center"> 비밀번호</td>
<td><input type="password" id="pwd"><br>
<div id="pwdDiv" ></div></td>
</tr>
<tr>
<td align="center"> <input type="button" value="등록" > <input type=reset value="취소" > </td>
</tr>
</table>
</form>
</body>
</html>
================================ 글씨 입력시 히든처리
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
if($('#name').val()=='')
$('#nameDiv').text("이름입력").css("color","red").css("font-size","8pt");
if($('#id').val()=='')
$('#idDiv').text("아이디입력").css("color","black").css("font-size","8pt");
if($('#pwd').val()=='')
$('#pwdDiv').text("비번입력").css("color","black").css("font-size","8pt");
$('#name').keyup(function(){
if($(this).val().length==0)
$('#nameDiv').text("이름입력").css("color","red").css("font-size","8pt");
else
$('#nameDiv').text("");
});
$('#id').keyup(function(){
if($(this).val().length==0)
$('#idDiv').text("아이디입력").css("color","red").css("font-size","8pt");
else
$('#idDiv').text("");
});
$('#pwd').keyup(function(){
if($(this).val().length==0)
$('#pwdDiv').text("비번입력").css("color","red").css("font-size","8pt");
else
$('#pwdDiv').text("");
});
});
</script>
</head>
<body>
<form name="userInsertForm" action="/Chapter06_DynamicSpringMaven/user/userInsert.do" method="POST">
<table border="1" cellpadding="3" cellspacing="0">
<tr>
<td align="center"> 이름</td>
<td><input type="text" id="name" ><br>
<div id="nameDiv" ></div>
</td>
</tr>
<tr>
<td align="center"> 아이디</td>
<td><input type="text" id="id"><br>
<div id="idDiv" ></div></td>
</tr>
<tr>
<td align="center"> 비밀번호</td>
<td><input type="password" id="pwd"><br>
<div id="pwdDiv" ></div></td>
</tr>
<tr>
<td colspan=2 align="center"> <input type="button" value="등록" > <input type=reset value="취소" > </td>
</tr>
</table>
</form>
</body>
</html>
======================= 중복체크 추가
'JAVA 개발 공부 정보' 카테고리의 다른 글
| [JAVA] JSON - Jackson Databind (0) | 2018.02.26 |
|---|---|
| [java-note] 회원정보 jqeury 연습 소스 (0) | 2018.02.26 |
| [java-note] Chapter06_1 get-> post 방식 변경 & 한글깨짐 보완 (0) | 2018.02.22 |
| [java-note] fmt태그 사용하고 소수점 제외방법 #.## 사용 (0) | 2018.02.22 |
| [java-note] Chapter06_1 콘트롤러 다른 방법 (0) | 2018.02.22 |