'JS'에 해당되는 글 15건

 
  1. 2014.03.03 [JS/JQUERY] 자바스크립트 제이쿼리로 3자리마다 콤마, 숫자 통화 변경
  2. 2014.02.20 [JS/JQUERY] 제이쿼리로 자바스크립트 페이지 온로드 샘플 예제, Javascript onload function as Jquery
  3. 2014.02.17 [JS/JQUERY] 제이쿼리 셀렉터 예제, jQuery Selector Example, siblings, prevAll, append, parent, css
  4. 2013.06.19 [JQUERY/JS] 페이지 안에서 검색, Ctrl+F 검색기능
  5. 2013.05.23 [JQUERY/JS] jQuery로 JSON타입 오브젝트를 복사하는 방법, JSON Copy, Clone, JSON.stringify, JSON.parse
  6. 2013.01.28 [JAVASCRIPT/JS] Date, getYear, getMonth, getDate 달력에 년 월 일 계산, 한자리 월, 일에 0 붙이기
  7. 2012.09.06 [JAVASCRIPT] Javascript setCookie getCookie deleteCookie, 자바스크립트 함수
  8. 2012.08.31 [JavaScript/JS] 자바스크립트 소숫점 반올림하기 Math.round()
  9. 2012.01.04 [JQuery/JS] 셀렉트박스 변경할때 글 읽어오기, Selectbox onChange Ajax
  10. 2011.12.28 [RUN/JS] JavaScript 인코딩 함수 escape(), encodeURI(), encodeURIComponent()
  11. 2011.12.27 [RUN/JS] 키코드 확인 스크립트, Keyboard KeyCode
  12. 2011.06.13 [JavaScript/JS] 자바스크립트 숫자에 천단위 콤마, 통화형식으로 변환 toLocaleString
  13. 2010.10.12 [JQUERY] jQuery 플러그인 시리즈 홈페이지, 다운로드 (1)
  14. 2010.07.06 [JAVASCRIPT/SCRIPT] 디데이(D-Day), 지난날짜 계산하기
  15. 2010.03.08 [JS,CSS] 잘까먹는 속성, 함수들
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. 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. 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. 6. 09:30 COMPUTER/JAVASCRIPT, JQUERY
[JAVASCRIPT] Javascript setCookie getCookie deleteCookie, 자바스크립트 함수

말이 필요없는 함수

 

쿠키 저장

setCookie('변수명','값','만료일','도메인','보안');

 

쿠키 로드

getCookie('변수명');

 

쿠키 삭제

deleteCookie('변수명');

 

 
<script>

function setCookie(cookieName, cookieValue, cookieExpire, cookiePath, cookieDomain, cookieSecure){
	var cookieText=escape(cookieName)+'='+escape(cookieValue);
	cookieText+=(cookieExpire ? '; EXPIRES='+cookieExpire.toGMTString() : '');
	cookieText+=(cookiePath ? '; PATH='+cookiePath : '');
	cookieText+=(cookieDomain ? '; DOMAIN='+cookieDomain : '');
	cookieText+=(cookieSecure ? '; SECURE' : '');
	document.cookie=cookieText;
}

function getCookie(cookieName){
	var cookieValue=null;
	if(document.cookie){
		var array=document.cookie.split((escape(cookieName)+'=')); 
		if(array.length >= 2){
			var arraySub=array[1].split(';');
			cookieValue=unescape(arraySub[0]);
		}
	}
	return cookieValue;
}

function deleteCookie(cookieName){
	var temp=getCookie(cookieName);
	if(temp){
		setCookie(cookieName,temp,(new Date(1)));
	}
}

</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. 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/

댓글을 달아 주세요

  1. 플러그인 시리즈 홈페이지, 다운로드

    2011.06.10 18:00 [ ADDR : EDIT/ DEL : REPLY ]

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);

댓글을 달아 주세요

최근에 올라온 글

최근에 달린 댓글