저장소

datepicker로 input text의 value값을 바꾼 후 체크하는 스크립트를 태워야 할 때

value에 바로 박힌 값은 onchange로 체크가 불가능하다.

그럴 때는

$(document).ready(function(){

$('#teqst').datepicker({

onSelect: function(dateText, inst){

chkSet('1111',0);

}

});

});

onSelect {} 안에 진행할 스크립트 소스를 넣어준다.

그럼 datepicker 스크립트 실행 후 넣어준 소스 스크립트를 진행한다.

<style type="text/css">

.agree_box_span {font-weight:bold;text-decoration:underline;}

</style>

태그 열고, 닫고 안에

클래스명 {클래스 속성}

작성해주면 끝.

egovframework에서 showModalDialog가 크롬에서 적용안될 때 대체 사용 기능을 제공한다.

URL : https://www.egovframe.go.kr/wiki/doku.php?id=egovframework:com:v3:cmm:showmodaldialog

JavaScript의 Modal 방식의 dialog를 지원하는 windows.showModalDialog의 기능이 chrome 37 버전부터 지원하지 않음에 따라 대체 기능을 제공한다.

js파일을 제공하며, 이미 공통 js를 쓰고있는 경우에는 공통 js 코드만 추가해주면 별도의 script 선언없이 공통적용도 가능하다.

▼ 아래는 공통관련 부분 내용이다.

6. 공통 js 파일을 통해 처리하는 경우 js 파일 처리

function dirname(path) {
	if (path.lastIndexOf("/") == -1)
		return "./";
	return path.replace(/\\/g, '/').replace(/\/[^\/]*\/?$/, '') + "/";
}
 
function getActiveScript() {
	var d = document.getElementsByTagName("script");
	var path = dirname(d[d.length - 1].src);
	delete d;
 
	var offset=path.indexOf(location.host)+location.host.length;
	return path.substring(offset);
} 
 
 
function getContextPath(){
    var offset=location.href.indexOf(location.host)+location.host.length;
    var ctxPath=location.href.substring(offset, location.href.indexOf('/',offset+1));
 
    if ((/^\/js/).test(getActiveScript())) {
    	return "";
    }
 
    return ctxPath;
}
 
function loadScript(src, f) {
  var head = document.getElementsByTagName("head")[0];
  var script = document.createElement("script");
  script.src = src;
  var done = false;
  script.onload = script.onreadystatechange = function() { 
    // attach to both events for cross browser finish detection:
    if ( !done && (!this.readyState ||
      this.readyState == "loaded" || this.readyState == "complete") ) {
      done = true;
      if (typeof f == 'function') f();
      // cleans up a little memory:
      script.onload = script.onreadystatechange = null;
      head.removeChild(script);
    }
  };
  head.appendChild(script);
}
 
loadScript(getContextPath() + '/js/egovframework/com/cmm/showModalDialog.js');

<input type="text" style="IME-MODE: disabled;" onkeypress="if ((event.keyCode<48) || (event.keyCode>57)) event.returnValue=false;" />

IME-MODE: disabled

- 한글 입력 방지

※ ime-mode의 속성

　　auto -> 기본값. 아무것도 지정 안하면 이거다.

　　active -> 포커스가 들어가자마자 한글

　　inactive -> 포커스가 들어가자마자 영어

　　disabled -> 한글 입력 불가

onkeypress

- KeyCode 48 ~ 56(숫자)만 입력 허용

기존에는 numberOnly 라는 공통 스크립트를 만들어서 썼는데 지금 사이트는 2년전 구축된 거라 이렇게 사용하고 있음

onkeypress 로 체크하는건 간편하나, IE 브라우저 버전을 탄다는 문제가 있었음

IE 7에서 먹히는 스크립트였다.

그래서 임시방책으로 해결한 것이

<meta http-equiv='X-UA-Compatible' content='IE=EmulateIE7,IE=EmulateIE6' />

meta 소스에 IE7 에뮬레이터 소스를 추가해줬음

웹에서는 상관없으나 모바일에서는 어떤 영향을 줄지는 아직 확인 못함 ㅠ

그러나 위에 메타태그를 추가하면 모바일에서도 작동 가능하다.

실수형 데이터 타입 관련 에러.

JSP 혹은 JAVA 단에서 String 타입 데이터를 Int 형으로 받을 때 오류 뜸

$(document).ready(function() {

document.oncontextmenu = new Function('return false');

document.ondragstart = new Function('return false');

document.onselectstart = new Function('return false');

$(function() {function updateInputCount() {

$("[id^=careerDesc_]").each(function(i){

var totalByte = 0;    // 총 byte 수

var savaMsg = "";    // 최대 byte수 초과시 textarea에 담아줄 값

var message = $(this).val();    // 현재 입력된 값

// 현재 입력된 값의 글자수 만큼 for문을 돌린다.

for(var i =0; i < message.length; i++) {

// 해당 글자의 code를 가져온다

var currentByte = message.charCodeAt(i);

// 한글은 2자, 그외는 1자를 추가해준다

if(currentByte > 128) totalByte += 2;

else totalByte++;

// 최대 Byte가 되기 전까지 메시지를 저장한다.

if(totalByte <= 400){

savaMsg += message.charAt(i);

}

}

var cnt = totalByte;

$(this).next().children().first().text(cnt);

if(cnt >= 400){

// 최대 Byte 수를 넘은 경우 textarea에 저장한 msg를 담아준다.

$(this).val(savaMsg);

}

});

}

$('textarea')

.focus(updateInputCount)

.blur(updateInputCount)

.keypress(updateInputCount);

window.setInterval(updateInputCount, 100);

updateInputCount();

});

});

[BODY]

<p class="txt_long byte"><span class="inputCnt">0</span>/400byte</p>

span class에 inputCnt를 넣어주면 자동으로 현재 byte수를 담아준다.

Input 창의 값을 수정 못하게 할 때는

<input id="test" readonly="readonly">

select 창의 값을 수정 못하게 할 때는

<select id="test" disable="disable">

readonly => form에 담겨져 submit 가능

disable => form에 담겨지지 않아서 submit 불가능