var pwdFlag = 0;


$(function(){

$('#check_regist_email_password').keyup(function(){

  if($('#regist_email_password').val() != $('#check_regist_email_password').val()){

  $('#check_regist_email_password').next().html('<span style="color:red;">암호가 틀립니다</span>');

  pwdFlag = 0;

  return false;

  } else {

  $('#check_regist_email_password').next().html('<span style="color:red;">암호가 맞습니다</span>');

  pwdFlag = 1;

  return true;

  }     

       });

})

'Programming > jQuery' 카테고리의 다른 글

[ajax]multipart form 전송  (0) 2016.10.13
JQuery.each()  (0) 2015.07.15
[jQuery] function 정의  (0) 2015.07.02
 <script type="text/javascript">

var formFile = document.getElementById('file').files[0];
var formData = new FormData();
formData.append('file', formFile);
formData.append('video_duration', Math.floor(aud.duration));

var url = "api 호출 url";

$.ajax({
	url: url,
	type: "POST",
	dataType: "json",
	data: formData,
	processData: false,
	contentType: false,
	success: function(data) {
			console.log(data);
		}
	}, error: function(request,status,error) {
		console.log("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
	}
});

 </script>
INPUT type file로 파일 업로드 구현 스크립트


//script
$(document).ready(function() {
	
	$('#file').change(function(){
		
		var fileInput = document.getElementById('file');
		var file = fileInput.files[0];
	    var reader = new FileReader();
	    reader.onload = function() {
		
	        var aud = new Audio(reader.result);
	        aud.onloadedmetadata = function(){
			
				// 동영상 파일의 재생 길이(초)
				console.log(aud.duration);
							
				// input file을 가져옴
				var formFile = document.getElementById('file').files[0];
				console.log(formFile);
				var formData = new FormData();
				formData.append('file', formFile);
				formData.append('video_duration', Math.floor(aud.duration));
			
				var url = "API 호출 URL";
				
				$.ajax({
					url: url,
					type: "POST",
					dataType: "json",
					data: formData,
					processData: false,
					contentType: false,
					success: function(data) {
						console.log(data);
					}, error: function(request,status,error) {
						console.log("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
					}
				});
	    		
	    	}
	    }
	    
	    reader.readAsDataURL(file);	
		
	});

JSP
 
		
//JSP
컨트롤러
 

//CONTROLLER
@ResponseBody
@RequestMapping(value="해당 URL", method=RequestMethod.POST)
public Response testUpload(
		// script에서 append한 객체를 map으로 받음
		@RequestParam Map map, 
		// multipart file을 part로 받음 
		@RequestPart(value="file", required=false) MultipartFile file,
		HttpSession session,
		HttpServletRequest request) throws JsonProcessingException {
	
	DataMap dataMap = new DataMap(map);
	dataMap.put("file", file);
	
	logger.debug("dataMap {} ", dataMap);
	
	DataMap result = service.insetVideoTest(dataMap);
	
	return ResponseUtil.responseResult(result);
}

'Programming > jQuery' 카테고리의 다른 글

[jquery] 패스워드 에러 표현 innerHtml  (0) 2017.03.27
JQuery.each()  (0) 2015.07.15
[jQuery] function 정의  (0) 2015.07.02

JQuery .each() 메서드


http://api.jquery.com/jquery.each/



Examples:

Example: Iterates through the array displaying each number as both a word and numeral

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.each demo</title>
<style>
div {
color: blue;
}
div#five {
color: red;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
<div id="four"></div>
<div id="five"></div>
<script>
var arr = [ "one", "two", "three", "four", "five" ];
var obj = { one: 1, two: 2, three: 3, four: 4, five: 5 };
jQuery.each( arr, function( i, val ) {
$( "#" + val ).text( "Mine is " + val + "." );
// Will stop running after "three"
return ( val !== "three" );
});
jQuery.each( obj, function( i, val ) {
$( "#" + i ).append( document.createTextNode( " - " + val ) );
});
</script>
</body>
</html>



$("#listBnt").click(function viewAjax() {
$('#jsonlist').empty();
console.log("리스트 버튼 들어옴");
$.ajax({
type: "GET",
url: "/testajax/main/users/",
dataType: "json",
success: function (response) {
console.log("불러오기 성공");
// each 함수 $(불러온데이터).each(fucntion (인덱스, 불러온데이터각각의 값)){}
$(response).each(function (i,data ) {
var d = "<table class='table table-striped'>";
d += "<th class='tid'>" + data.id + "</th>";
d += "<th class='tname'>" + data.name + "</th>";
d += "<th class='temail'>" + data.email + "</th>";
d += "<th class='tage'>" + data.age + "</th>";
d += "</table>";
$("#jsonlist").append(d);
})
},
error: function (e) {
console.log("error");
console.log("error 정보 : " + e.status);
}
});
});


'Programming > jQuery' 카테고리의 다른 글

[jquery] 패스워드 에러 표현 innerHtml  (0) 2017.03.27
[ajax]multipart form 전송  (0) 2016.10.13
[jQuery] function 정의  (0) 2015.07.02

첫번째의 경우

 

$(document).ready(function(){
 ...

});

-> window.onload = function() {}과 같은 기능

 

두번째의 경우

 

$(function(){
  ..

});
 

그냥 함수를 실행하라는 의미 입니다.

 

세번째의 경우

 

(function($){


})(jQuery);

 

이경우는 Jquery를 사용할 때, $ 달러의 의미를 jquery에서 사용하겠다는 의미가 내포되어 있습니다.

즉, $를 jquery만 사용하는 것이 아니라 다른 라이브러리에서도 사용할 수 있기 때문이에요.

만약 prototype.js 랑 jquery를 같이 사용하는 경우에는  $가 충돌이 발생하는 것입니다.

 

그래서 아예..

함수로 $를 매개변수로 해서 넘기는 것입니다.

jQuery 이것이 jquery 객체이지요.

저 함수안에서 $의 의미는 jquery 객체로 사용이 되는 것이에요..

 

prototype.js 와 jquery로 프로그래밍을 함께 병행하실 때는..

(function($){

...

..

..

   이 안에서만 jquery를 자유롭게 사용하게 됩니다.

...
})(jQuery);

 

 

출처 : 네이버지식인


===================================================================================


내가 이런 문법을 찾았던 이유는 jquery 때문은 아니었고

 

현대자동차 기업문화홍보 사이트의 소스를 보다가 처음보는 문장을 발견해서 찾기 시작했다..

 

여기서 나온 스크립트가 이것이었다..

        (function (w) {
            // version check
            var ua = window.navigator.userAgent;
            var msie = ua.indexOf("MSIE ");

            if (msie > 0 && parseInt(ua.substring(msie + 5, ua.indexOf(".", msie)), 10) < 7) {
                location.href = '/pages/common/NoticeIE6.aspx';
            }
        })(window);

 

첨엔 이게 뭔가 싶었다...

 

그러다가 jquery 플러그인 소스에서 이런 비슷한걸 보았던것 같아 책을 보았고

 

플러그인 파트에서 아래와 같은 문장을 찾게 되었다.

 (function($){
  //
  // 여기에 플러그인을 정의한다
  //
 })(jQuery);

 

 $라는 매개변수를 정의한 함수에 jQuery를 전달하면 $는 함수안에서 jQuery의 참조임이 보장된다. 

$는 jquery의 별칭이라고 한다. 

  '왜 이렇게 되었는지는 별로 생각하고 써본적이 없었는데

  jQuery를 $ 로 정의한 함수에 전달하기 때문에 $가 jquery의 별칭이 될수 있지 않나...'

  라는 생각을 해본다.ㅋ

이를통해 플러그인을 정의할 때 핵심 내용을 작성하는데 $를 사용할 수 있다.

물론 현대차 홍보페이지의 소스랑은 다르지만 이것과 비슷한 의미리라 생각한다.ㅋ

 

좋은 가르침이었다ㅋ

 

내가 이해한게 제대로 된건가.. 싶다..ㅋㅋ

'Programming > jQuery' 카테고리의 다른 글

[jquery] 패스워드 에러 표현 innerHtml  (0) 2017.03.27
[ajax]multipart form 전송  (0) 2016.10.13
JQuery.each()  (0) 2015.07.15

+ Recent posts