'javascript'에 해당되는 글 26건

 
  1. 2020.11.17 Access to fetch at 'https://도메인/엔드포인트' from origin 'https://호출한도메인' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
  2. 2014.04.25 [HTML/JAVASCRIPT/JQUERY] TAG REPLACE
  3. 2014.03.14 [MAP/DAUM] 다음 맵 API 한 화면에 지도 여러개 띄우기 샘플, 코드
  4. 2014.03.06 [CSS] 커스텀 체크박스 스타일시트 예제, 모바일용, ✔
  5. 2014.03.03 [JS/JQUERY] 자바스크립트 제이쿼리로 3자리마다 콤마, 숫자 통화 변경
  6. 2014.02.20 [JS/JQUERY] 제이쿼리로 자바스크립트 페이지 온로드 샘플 예제, Javascript onload function as Jquery
  7. 2014.02.17 [JS/JQUERY] 제이쿼리 셀렉터 예제, jQuery Selector Example, siblings, prevAll, append, parent, css
  8. 2013.09.16 [JavaScript/jQuery] 자바스크립트 제이쿼리 숫자에 천단위 콤마, 통화형식으로 변환 1
  9. 2013.06.19 [JQUERY/JS] 페이지 안에서 검색, Ctrl+F 검색기능
  10. 2013.06.18 [JS/IE7] 인터넷 익스플로어 7 용 JSON 라이브러리 파일 1
  11. 2013.05.23 [JQUERY/JS] jQuery로 JSON타입 오브젝트를 복사하는 방법, JSON Copy, Clone, JSON.stringify, JSON.parse
  12. 2013.01.28 [JAVASCRIPT/JS] Date, getYear, getMonth, getDate 달력에 년 월 일 계산, 한자리 월, 일에 0 붙이기
  13. 2012.09.03 [RegEx/JS] 자바스크립트로 언더바 문자를 낙타표기법으로 변환 (JavaScript, Camel Notation, Underscore
  14. 2012.08.31 [JavaScript/JS] 자바스크립트 소숫점 반올림하기 Math.round()
  15. 2012.04.09 [JavaScript/JQuery] 체크박스 이벤트, 객체 디세이블
  16. 2012.01.05 [JQuery/JS] 로그인용 엔터키 자동 포커스 이동 서브밋 스크립트, Enterkey Event Auto-Focusing For Login Form
  17. 2012.01.04 [JQuery/JS] 셀렉트박스 변경할때 글 읽어오기, Selectbox onChange Ajax
  18. 2011.12.28 [RUN/JS] JavaScript 인코딩 함수 escape(), encodeURI(), encodeURIComponent()
  19. 2011.12.27 [RUN/JS] 키코드 확인 스크립트, Keyboard KeyCode
  20. 2011.06.13 [JavaScript/JS] 자바스크립트 숫자에 천단위 콤마, 통화형식으로 변환 toLocaleString
  21. 2010.10.12 [JQUERY] jQuery 플러그인 시리즈 홈페이지, 다운로드 1
  22. 2010.10.11 [AJAX] 기본 예제, httpRequest Sample 1
  23. 2010.10.05 [JQUERY] JQuery Selector, 객체 선택 9
  24. 2010.07.06 [JAVASCRIPT/SCRIPT] 디데이(D-Day), 지난날짜 계산하기
  25. 2010.03.08 [JS,CSS] 잘까먹는 속성, 함수들
  26. 2009.06.26 javascript cross domain access
2020. 11. 17. 17:00 DEV ENVIRONMENT
Access to fetch at 'https://도메인/엔드포인트' from origin 'https://호출한도메인' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

포스트맨으로는 잘되던게 실제 브라우저에서는 오류가 발생했습니다.

알아보니까 실제로는 OPTIONS라는 메소드로 먼저 호출을 한다고 하는데,

그 이름이 PREFLIGHT라고 하네요.

 

그래서 오류가 일반적인 CORS오류가 아니고

blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

라고 적혀있습니다.

 

Access to fetch at 'https://도메인/엔드포인트' from origin 'https://호출한도메인' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

 

스프링프레임웤(스프링부트)에서 해결하는 방법

 

1. 파일중에 WebSecurityConfigurerAdapter를 상속받은 클래스를 찾는다.

 

 

2. 오버라이드 된 configure(HttpSecurity http)메소드를 편집한다. (없으면 만듦)

@Override
protected void configure(HttpSecurity http) throws Exception {

 

 

3. http에 코드 추가

.cors().and()
.requestMatchers(CorsUtils::isPreFlightRequest).permitAll()

 

 

* 리액트프론트용 자바스크립트 코드

브라우저에 붙여서 테스트

var Data = {
  METHOD : {
    GET : 'GET',
    POST : 'POST',
    PUT : 'PUT',
    DELETE : 'DELETE'
  },
  TYPE : {
    FILE_UPLOAD : 'Data.TYPE.FILE_UPLOAD'
  },
  load : ( option ) => {
    const accessToken = localStorage.getItem('access.token');
    let parameters = {
      headers : { Authorization : accessToken ? `Bearer ${ accessToken }` : '' },
      method : option.method || Data.METHOD.GET
    };
    switch ( option.method ) {
      case Data.METHOD.POST :
      case Data.METHOD.PUT :
        option.type !== Data.TYPE.FILE_UPLOAD && ( parameters = { ...parameters, headers : { 'Content-Type' : 'application/json' } } );
        break;
      default :
    }
    if ( option.data ) {
      let data;
      if ( option.type === Data.TYPE.FILE_UPLOAD ) {
        data = new FormData();
        for ( let i in option.data ) {
          data.append( i, option.data[ i ] );
        }
      } else {
        data = JSON.stringify( option.data );
      }
      parameters = { ...parameters, body : data };
    }
    window.fetch( option.url, parameters )
      .then( response => response.json() )
      .then(
        ( data ) => {
          if ( data.code === 'S000000' ) {
            option.success && option.success( data.data );
          } else if ( data.hwrErrorCode?.code === 'ERR_SUCCESS' ) {
            option.success && option.success( data.candidates[ 0 ] )
          } else {
            option.error && option.error( data );
          }
        }
      );
  }
};
Data.load({url:'http://localhost/주소'});

 

 

2014. 4. 25. 15:32

보호되어 있는 글입니다.
내용을 보시려면 비밀번호를 입력하세요.

2014. 3. 14. 14:49 COMPUTER/JAVASCRIPT, JQUERY
[MAP/DAUM] 다음 맵 API 한 화면에 지도 여러개 띄우기 샘플, 코드

다음지도를 한 화면에서 2개이상 띄우는 코드 입니다.

좌표는 당근 2개씩 있어야겠죠.

확대축소 컨트롤이랑 '지도/스카이뷰' 버튼은 함께 쓸수 있습니다.


좌표중 하나는 서울역이고, 다른하나는 광화문 근처입니다.



스크립트:

$(window).load(function(){
	var zoomControl=new daum.maps.ZoomControl();
	var mapTypeControl=new daum.maps.MapTypeControl();

	var longitude='126.980101';
	var latitude='37.571982';
	var mapLongitude='126.978456';
	var mapLatitude='37.571702';

	map=new daum.maps.Map(document.getElementById('map1'),{
		center:new daum.maps.LatLng(mapLatitude,mapLongitude),
		level:4
	});

	map.addControl(zoomControl,daum.maps.ControlPosition.RIGHT);
	map.addControl(mapTypeControl,daum.maps.ControlPosition.TOPRIGHT);
	
	var marker=new daum.maps.Marker({position:new daum.maps.LatLng(latitude, longitude)});
	marker.setMap(map);



	var longitude2='126.9740458';
	var latitude2='37.5542316';

	map2=new daum.maps.Map(document.getElementById('map2'),{
		center:new daum.maps.LatLng(latitude2,longitude2),
		level:3
	});

	map.addControl(zoomControl,daum.maps.ControlPosition.RIGHT);
	map2.addControl(mapTypeControl,daum.maps.ControlPosition.TOPRIGHT);

	var marker2=new daum.maps.Marker({position:new daum.maps.LatLng(latitude2,longitude2)});
	marker2.setMap(map2);
});




HTML:
<div class="map_area" id="map1" style="width:100%;height:400px;">
<div class="map_area" id="map2" style="width:100%;height:400px;">


2014. 3. 6. 09:27 COMPUTER/JAVASCRIPT, JQUERY
[CSS] 커스텀 체크박스 스타일시트 예제, 모바일용, ✔

누군가 만들어놓은 커스텀 체크박스 스타일 시트 입니다.

사용법은 <input type="checkbox" class="custom-check"........

처럼 쓰면 됩니다.





input[type=checkbox].custom-check{ 
    position: absolute; overflow:hidden; width:1px;height:1px; 
    clip:rect(0 0 0 0);margin:-1px;padding:0;border:0; 
} 

input[type=checkbox].custom-check + label.custom-check{ 
    display:inline-block; 
    padding-left:1em; 
} 

input[type=checkbox].custom-check:checked + label.custom-check:before{ 
    position:absolute;margin-left:-1em; 
    content:'✔'; 
}


2014. 3. 3. 17:44 COMPUTER/JAVASCRIPT, JQUERY
[JS/JQUERY] 자바스크립트 제이쿼리로 3자리마다 콤마, 숫자 통화 변경
전에도 한번 쓴거 같긴한데;;;
고리짝 코드입니다.
전 요즘에 싸이코 기질이 발동해서 이렇겐 안씁니다만, 코드가 알아보기 쉽고 좆네욤;;;


정규 표현식을 이용한 자바스크립트로 3자리마다 콤마넣기의 한 예
//콤마찍기
function numberFormat(num) {
var pattern = /(-?[0-9]+)([0-9]{3})/;
while(pattern.test(num)) {
num = num.replace(pattern,"$1,$2");
}
return num;
}
 
//콤마제거
function unNumberFormat(num) {
return (num.replace(/\,/g,""));
}




toLocaleString를 이용한 제이쿼리로 3자리마다 콤마 넣기
var funcSetCurrency=function($){
$('#tableData td').each(function(){
if(!isNaN(Number($(this).text())) && $(this).text()) $(this).text(Number($(this).text()).toLocaleString().split('.')[0]);
});
};

$(document).ready(function(){
funcSetCurrency($);
});



2014. 2. 20. 22:36 COMPUTER/JAVASCRIPT, JQUERY
[JS/JQUERY] 제이쿼리로 자바스크립트 페이지 온로드 샘플 예제, Javascript onload function as Jquery
jquery로 페이지가 로딩 되었을 때 스크립트를 수행합니다.
안에 있는 코드는 jqgrid를 100%넓이로 맹그러주기 위해 창 리사이즈를 이벤트로 잡은 코드입니다.

$(function(){}); 요것만 쓰면 됩니다.

<body onload="alert()"> 과 같습니다.


<script type="text/javascript" src="/library/jquery-1.7.2.js"></script>
<script>
//<![CDATA[
$(function(){
	$(window).bind('resize', function() {
    	$("#jqgrid1").setGridWidth($(window).width()-16);
	}).trigger('resize');
});
//]]>
</script>








2014. 2. 17. 09:30 COMPUTER/JAVASCRIPT, JQUERY
[JS/JQUERY] 제이쿼리 셀렉터 예제, jQuery Selector Example, siblings, prevAll, append, parent, css

나(this)의 상위를 제외한 같은레벨의 백그라운드 컬러를 빨간색으로 변경

$(this).parent().siblings().css("background-color", "red");


나의 상위중 클래스가 .txt_2인 가장 가까운 객체의 백그라운드 컬러를 빨간색으로 변경

$(this).parent().prevAll('.txt_2:first').css("background-color", "red");


div의 lang속성에 안두리를 포함한 태그안에 html추가

$('div[lang*="kaudo"]').append('<p class="title_3">안녕하세요.</p>');



2013. 9. 16. 10:25 COMPUTER/JAVASCRIPT, JQUERY
[JavaScript/jQuery] 자바스크립트 제이쿼리 숫자에 천단위 콤마, 통화형식으로 변환

가격으로 된 숫자에 콤마를 찍어주는 스크립트 입니다.

2000 > 2,000

1123000 > 1,123,000



이전 스크립트는 아이폰 사파리에서 작동하지 않습니다.

2011/06/13 - [SCRIPTING/JAVASCRIPT/JQUERY] - [JavaScript/JS] 자바스크립트 숫자에 천단위 콤마, 통화형식으로 변환 toLocaleString



<script>

$(document).ready(function(){ $('.intCurrency').each(function(index){ $(this).text($(this).text().split(/(?=(?:\d{3})+(?:\.|$))/g).join(',')); }); }); </script>

<span class="red intCurrency">2000</span> <span class="intCurrency sibol kkk">123000</span>





2013. 6. 19. 13:21 PROGRAMMING
[JQUERY/JS] 페이지 안에서 검색, Ctrl+F 검색기능

화면안에서 검색할 수 있게 해주는 스크립트 입니다.

DOM방식으로 작동하는 스크립트 소스를 수정한 것입니다.

이 소스는 인풋박스 한개와 버튼 한개를 사용하고 있습니다.



contsrch.js




$('a[name="btnContSrch"]').unbind('click').click(function(){
	var strContSrch=$('input[name="txtContSrch"]').val();
	if(strContSrch==$strContSrchInit || !strContSrch){
		alert('검색어를 입력하세요.');
		$('input[name="txtContSrch"]').focus();
		return false;}
	if(navigator.appName.indexOf("Microsoft")<0){
		if(!window.find(strContSrch,false,false,true,false,false,true)){
		}
		return false;
	}
	bodySearchAll('areaDetail'/*bodySideContent*/,strContSrch,'txtContSrch'/*bdySearch 버튼*/, 'down'/*chkMode*/);
	return false;
});
$('input[name="txtContSrch"]').val($strContSrchInit).bind('focus',function(){
	if($(this).val()==$strContSrchInit) $(this).val('');
}).bind('blur',function(){
	if(!$(this).val()) $(this).val($strContSrchInit);
}).bind('keyup',function(){
	if(event.keyCode!=13) return;
	return $('a[name="btnContSrch"]').click();
	return false;
});
끝;
2013. 6. 18. 13:10 COMPUTER/JAVASCRIPT, JQUERY
[JS/IE7] 인터넷 익스플로어 7 용 JSON 라이브러리 파일

JSON.parse(), JSON.stringify(), JSON.encode()



json2.js


JSON 오브젝트를 생성하거나 스트링형태로 변환하거나 등등등 할때 쓰는 JSON.method들이 있습니다.

다른 브라우저들은 잘 되는데 IE7같은 고물 브라우저에서는 에러가 납니다.


<script type="text/javascript" src="json2.js" ></script>

처럼 첨부해주면 IE7에서도 JSON을 사용할 수 있습니다.


2013. 5. 23. 14:26 COMPUTER/JAVASCRIPT, JQUERY
[JQUERY/JS] jQuery로 JSON타입 오브젝트를 복사하는 방법, JSON Copy, Clone, JSON.stringify, JSON.parse

json을 var 변수2=변수1; 라고 코딩하면 복사가 되는게 아니고 이름이 두개가 됩니다.

그래서 JSON.stringify로 문자열로 변환했다가, JSON.parse로 JSON객체로 변화해준 값을 넣어주면 서로 다른 JSON객체가 생깁니다.

 

 

srchParams에 xtenSearchObj.param을 복사한 후 srchParams의 변수 두개를 1로 셋팅했습니다.

그리고 얼랏창으로 확인하면 xtenSearchObj.param.outmax값이 20, 그대로 남아있습니다.

 

 

2013. 1. 28. 23:29 COMPUTER/JAVASCRIPT, JQUERY
[JAVASCRIPT/JS] Date, getYear, getMonth, getDate 달력에 년 월 일 계산, 한자리 월, 일에 0 붙이기

자바스크립트로 날짜를 계산하는 예제입니다.

오늘 날짜를 생성한 후에 생성한 날짜 객체에다가 날짜를 변경하여 다시 정의합니다.

 

 

<script src="http://code.jquery.com/jquery.min.js"></script>
<script>
$(document).ready(function(){

	// 날짜 객체 생성
	var date=new Date();

	// 날짜에 10일을 더한 후 재정의
	date=new Date(date.getYear(),date.getMonth(),date.getDate()+10);

	// 날짜를 메세지로 표시한다.
	alert(date.getFullYear()+' '+
		((date.getMonth()+1)<10 ? '0'+(date.getMonth()+1) : (date.getMonth()+1))+' '+
		(date.getDate()<10 ? '0'+date.getDate() : date.getDate() ) );

});
</script>

 

제이쿼리의 온로드에 예제를 작성했습니다.

 

날짜를 계산하고 얼랏으로 확인한 화면

2012. 9. 3. 15:46 COMPUTER/JAVASCRIPT, JQUERY
[RegEx/JS] 자바스크립트로 언더바 문자를 낙타표기법으로 변환 (JavaScript, Camel Notation, Underscore

네이밍 변환 스크립트(정규표현식) 입니다.

 

데이타베이스에서 많이쓰는 컬럼명 대문자_대문자
예를들면 - SEQ_NUM, ORDER_COST, USER_PHONE_NO...

 

프로그램 네이밍시 많이쓰는 변수/함수명

예를들면 - userId, tableName...

 

서로 변환할 수 있는 함수 입니다.

정규표현식이므로 어떤 언어에서도 적용할 수 있습니다.

 

 

대문자 언더바구분 형식으로 낙타표기법으로 변환

RESULT: kaudoAhndoori

<script>

var under2camel=function(str){
	return str.toLowerCase().replace(/(\_[a-z])/g, function(arg){
		return arg.toUpperCase().replace('_','');
	});
}

var result=under2camel('kaudo_ahndoori');
document.write(result);

<script>

 

낙타표기법을 대문자 언더바구분 형식으로 변환

RESULT: AHNDOORI_KAUDO

<script>

var camel2under=function(str){
	return str.replace(/([A-Z])/g, function(arg){
		return "_"+arg.toLowerCase();
	}).toUpperCase();
}

var result=camel2under('ahndooriKaudo');
document.write(result);

<script>
2012. 8. 31. 13:49 COMPUTER/JAVASCRIPT, JQUERY
[JavaScript/JS] 자바스크립트 소숫점 반올림하기 Math.round()

자바스크립트로 소숫점 숫자 표현하는 방법입니다.

 

Math.round(값) - 값을 반올림합니다.

Math.ceil(값) - 값을 올림합니다.

Math.floor(값) - 값을 내림합니다.

Math.parseInt(값) - 값을 정수로 바꿉니다. (값이 소숫점이 있는 숫자일 경우엔 소숫점 이하를 잘라버립니다. 내림)

 

10의 n승을 곱하고 반올림 한 결과를 다시 10의 n승으로 나누면

원하는 소숫점 자릴수를 표현할 수 있습니다.

 

<body/>
<script>

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'반올림 (소숫점0번째까지)<br/>'+
	'Math.round(45.67890) : '+
	Math.round(45.67890);

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'올림 (소숫점0번째까지)<br/>'+
	'Math.ceil(45.67890) : '+
	Math.ceil(45.67890);

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'내림 (소숫점0번째까지)<br/>'+
	'Math.floor(45.67890) : '+
	Math.floor(45.67890);

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'내림 (소숫점0번째까지)<br/>'+
	'parseInt(45.67890) : '+
	parseInt(45.67890);


document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점 2번째까지 반올림<br/>'+
	'Math.round(123.4567) : '+
	Math.round(123.4567*100)/100;

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점 4번째까지 올림<br/>'+
	'Math.ceil(123.4567) : '+
	Math.ceil(123.4567*10000)/10000;

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점 4번째까지 내림<br/>'+
	'Math.floor(123.4567) : '+
	Math.floor(123.4567*10000)/10000;

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점 3번째까지 내림<br/>'+
	'parseInt(123.4567) : '+
	parseInt(123.4567*1000)/1000;


document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'소숫점있는 문자열을 숫자(float)로 변환<br/>'+
	'parseFloat("12.3456789") : '+
	parseFloat("12.3456789");


document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'앞에 0이 있는 문자열을 숫자(float)로 변환<br/>'+
	'parseInt("098.765") : '+
	parseInt("098.765");

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'앞에 0이 있는 문자열을 숫자(integer)로 변환<br/>'+
	'parseInt("011") : '+
	parseInt("011");


document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'문자를 숫자(float)로 변환<br/>'+
	'parseFloat("안두리") : '+
	parseFloat("안두리");

document.body.innerHTML=document.body.innerHTML+'<br/><br/>'+
	'문자를 숫자(integer)로 변환<br/>'+
	'parseInt("ahndoori") : '+
	parseInt("ahndoori");

</script>
2012. 4. 9. 13:18 COMPUTER/JAVASCRIPT, JQUERY
[JavaScript/JQuery] 체크박스 이벤트, 객체 디세이블

체크되면 사용금지, 해제되면 사용가능으로 바뀌는 JQuery 스크립트 입니다.

 

코드

<SCRIPT>
$(function(){

	$('input[name="test"]').click(function(){
		if($(this).attr('checked')){
			$('input[name="dis1"]').attr('disabled','disabled');
			$('input[name="dis2"]').attr('disabled','disabled');
		}else{
			$('input[name="dis1"]').removeAttr('disabled');
			$('input[name="dis2"]').removeAttr('disabled');
		}
	});

});
</SCRIPT>
<INPUT id=test type=checkbox name=test>
<INPUT id=dis1 value=zzz name=dis1>
<INPUT id=dis2 value=ggg name=dis2>

 

 

예제

 

2012. 1. 5. 13:06 COMPUTER/JAVASCRIPT, JQUERY
[JQuery/JS] 로그인용 엔터키 자동 포커스 이동 서브밋 스크립트, Enterkey Event Auto-Focusing For Login Form
엔터키를 누르면 아이디와 비밀번호값을 입력하게끔 포커스를 이동시켜줍니다.
다 입력됬으면 전송!

$(document).ready(function(){
$('body').keypress(function(e){
if(e.keyCode!=13) return;
if(!$('input[name="loginId"]').val()) $('input[name="loginId"]').focus();
if(!$('input[name="password"]').val()) $('input[name="password"]').focus();
$('form:eq(0)').submit();
});
});

2012. 1. 4. 22:54 COMPUTER/JAVASCRIPT, JQUERY
[JQuery/JS] 셀렉트박스 변경할때 글 읽어오기, Selectbox onChange Ajax


$('#[아이디]').change([함수명]=function(){
$.ajax({
url:'[주소]',
data:'변수명='+$(this).val(),
dataType:'json',
success:function(data){
if(!data.data || data.data=='' || data.data.length<1) return false;
$('#[대상]').html(data.[컬럼명]);
},
}); // $.ajax
});



SCRIPT

$('#boardDivnCd').change(changeBoardDivnCd=function(){
$.ajax({
url:'<c:url value="/0001/selectGftctPupl.do" />',
data:'boardDivnCd='+$(this).val(),
dataType:'json',
success:function(data){
if(!data.data || data.data=='' || data.data.length<1) return false;
$('#content').html(data.data[0].CONTENT);
},
}); // $.ajax
});


HTML

<select id="boardDivnCd" name="boardDivnCd">
<option value="55">일반게시판</option>
<option value="56">QnA게시판</option>
<option value="57">게시판</option>
</select>
<td id="content">내용내용내용</td>


JAVA

@RequestMapping("0001/selectGftctPupl.do")
public ModelAndView selectGftctPupl(HttpServletRequest request, HttpServletResponse response, Map<String, Object> model,0001Model 0001Model){
try{
List<DataMap> data=0001Service.selectGftctPupl(0001Model); // 데이터 조회
if(data==null || data.size()==0) return new ModelAndView("jsonView",model);
model.put("data",data);
}catch (Exception e){}
return new ModelAndView("jsonView",model);
}


2011. 12. 28. 13:17 COMPUTER/JAVASCRIPT, JQUERY
[RUN/JS] JavaScript 인코딩 함수 escape(), encodeURI(), encodeURIComponent()
javascript 인코딩 함수 샘플입니다.
아무데나 치면 해당 인코딩으로 변환하여 보여줍니다.
 
2011. 12. 27. 11:47 COMPUTER/JAVASCRIPT, JQUERY
[RUN/JS] 키코드 확인 스크립트, Keyboard KeyCode
왼쪽 텍스트입력칸에 키보드를 치면 오른쪽에 키코드가 나타납니다.
 
2011. 6. 13. 08:50 COMPUTER/JAVASCRIPT, JQUERY
[JavaScript/JS] 자바스크립트 숫자에 천단위 콤마, 통화형식으로 변환 toLocaleString
초간단 자바스크립트


<script>
document.write(
Number('25625623452345').toLocaleString().split(".")[0]
);
</script>

결과: 25,625,623,452,345


이 스크립트는 아이폰의 모바일 사파리에서 작동하지 않습니다.

아래 글을 참고하세요.

2013/09/16 - [SCRIPTING/JAVASCRIPT/JQUERY] - [JavaScript/jQuery] 자바스크립트 제이쿼리 숫자에 천단위 콤마, 통화형식으로 변환


2010. 10. 12. 18:06 COMPUTER
[JQUERY] jQuery 플러그인 시리즈 홈페이지, 다운로드
jQuery가 대세?

jqueryUI (jquery.js)
http://jqueryui.com/themeroller/

jqGrid (jquery.jqgrid.js)
http://www.trirand.com/blog/?page_id=6

jquery tablednd (jquery.tablednd.js)
http://code.google.com/p/tablednd/

jquery context menu (jquery.contextmenu.js)
http://abeautifulsite.net/blog/2008/09/jquery-context-menu-plugin/

2010. 10. 11. 10:01 COMPUTER/JAVASCRIPT, JQUERY
[AJAX] 기본 예제, httpRequest Sample

ajax의 가장 기본이자 핵심인 httpRequest,
함수로 만들어서 쓰면 코드를 줄일 수 있습니다.

var httpRequest=null;

function getXMLHttpRequest(){
 if (window.ActiveXObject){
  try{
   return new ActiveXObject("Msxml2.XMLHTTP");
  }catch(e){
   try{
    return new ActiveXObject("Microsoft.XMLHTTP");
   }catch(e1){ return null; }
  }
 }else if (window.XMLHttpRequest) return new XMLHttpRequest();
 else return null;
}

function sendRequest(url,params,callback,method){
 httpRequest=getXMLHttpRequest();
 var httpMethod=method ? method : 'GET';
 if(httpMethod!='GET' && httpMethod!='POST') httpMethod='GET';
 var httpParams=(params==null || params=='') ? null : params;
 var httpUrl=url;
 if (httpMethod=='GET' && httpParams != null) httpUrl=httpUrl+"?"+httpParams;
 httpRequest.open(httpMethod,httpUrl,true);
 httpRequest.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
 httpRequest.onreadystatechange=callback;
 httpRequest.send(httpMethod=='POST' ? httpParams : null);
}


사용법

sendRequest("test.jsp", "attr=10&value=안두리", funcReceived, "POST");

function funcReceived() {
 if (httpRequest.readyState == 4) {
  if (httpRequest.status == 200) {
   alert(httpRequest.responseText);
  }
 }
}
2010. 10. 5. 15:08 COMPUTER/JAVASCRIPT, JQUERY
[JQUERY] JQuery Selector, 객체 선택
제이쿼리를 이용할때 절대 잊으면 안되는것.
바로 html의 객체들을 선택할줄 알아야 뭔가 하겠죠.


$("font")
태그타입(Element)으로 찾기 - <font>안두볼</font>

$("div,a")
div와 a태그들을 선택합니다.

$("#kaudo")
아이디로 선택 - <a id="kaudo" class="link" href="http://www.kaudo.com">안두리</a>

$(".link")
CSS 클래스명으로 선택 - <a id="kaudo" class="link" href="http://www.kaudo.com">안두리</a>

$("*")
모든 태그(Element)를 선택합니다.

등록할때는 이런식으로
var objTest=$("#test");

 
John Resig @ Kings of Code 08
John Resig @ Kings of Code 08 by jaf 저작자 표시비영리동일조건 변경허락

2010. 7. 6. 17:09 COMPUTER/JAVASCRIPT, JQUERY
[JAVASCRIPT/SCRIPT] 디데이(D-Day), 지난날짜 계산하기

1. getTime() 메소드는 1970년 0시 0분 0초부터 해당시간까지의 밀리세컨드 타임으로 반환합니다.
2. 특정날짜와 현재시간을 getTime()으로 시간차를 얻은 후, 8640000으로 나누면 두날짜의 차이를 구할 수 있습니다.


예제1
var now=new Date();
var then=new Date("august 26, 2009");
var gap=now.getTime()-then.getTime();
gap=Math.floor(gap/ (1000*60*60*24));
document.write(now.getTime()+" "+then.getTime()+" "+(now.getTime()-then.getTime())+"<br>");
document.write(gap+"<br>");

 

예제2
var now=new Date();
var dday=new Date();
dday.setYear(2009);
dday.setMonth(8-1);
dday.setDate(23);
var togo=dday.getTime()-now.getTime();
var days=Math.abs(Math.floor(togo/(1000*60*60*24)));
document.write(days+'일');

2010. 3. 8. 23:36 COMPUTER/JAVASCRIPT, JQUERY
[JS,CSS] 잘까먹는 속성, 함수들
객체로 지정한 태그들의 위치값을 알아낼 수 있다

TAG.clientLeft
TAG.clientTop
TAG.clientWidth
TAG.clientHeight
TAG.offsetLeft
TAG.offsetTop

영역안에서 글씨가 넘어가버릴때 여러줄로 강제
word-wrap:break-word;word-break:break-all

한줄로 표시하고 점점점처리

NOBR width:WIDTH;text-overflow:ellipsis;overflow:hidden


페이지에서 루프 돌릴때 사용

ID=setInterval("FUNCTION()",INTERVAL);
ID=setTimeout("FUNCTION()",INTERVAL);
clearInterval(ID);
2009. 6. 26. 11:01 PROGRAMMING
javascript cross domain access
도메인이 서로 다른 페이지들끼리 통신하려면,
보안문제로 "사용 권한이 없습니다"라는 오류가 발생합니다.

www.kaudo.com과 blog.kaudo.com이 자바스크립트로 통신하려면 도메인을 맞춰주면 됩니다.
둘다 www와 blog의 서브도메인들이기때문에,
양쪽 페이지에
<script>
document.domain="kaudo.com";
</script>

처럼 코딩하면 문제없이 사용할 수 있습니다.

* www없는 kaudo.com과 같은 도메인도 www와는 다른도메인으로 인식합니다. www와 루트도메인을 섞어쓸때는 페이지 상단에 항상 document.domain="[루트도메인]";을 써주는게 좋습니다. (물론 도메인을 하나만 쓰는게 가장 이상적이죠__)

최근에 올라온 글

최근에 달린 댓글