'IT관련/JavaScript'에 해당되는 글 4건

function previewImage(targetObj, View_area) {
	var preview = document.getElementById(View_area); //div id
	var ua = window.navigator.userAgent;

	//ie일때(IE8 이하에서만 작동)
	if (ua.indexOf("MSIE") > -1) {
		targetObj.select();
		try {
			var src = document.selection.createRange().text; // get file full path(IE9, IE10에서 사용 불가)
			var ie_preview_error = document
					.getElementById("ie_preview_error_" + View_area);

			if (ie_preview_error) {
				preview.removeChild(ie_preview_error); //error가 있으면 delete
			}

			var img = document.getElementById(View_area); //이미지가 뿌려질 곳

			//이미지 로딩, sizingMethod는 div에 맞춰서 사이즈를 자동조절 하는 역할
			img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"
					+ src + "', sizingMethod='scale')";
		} catch (e) {
			if (!document.getElementById("ie_preview_error_" + View_area)) {
				var info = document.createElement("
");
				info.id = "ie_preview_error_" + View_area;
				info.innerHTML = e.name;
				preview.insertBefore(info, null);
			}
		}
		//ie가 아닐때(크롬, 사파리, FF)
	} else {
		var files = targetObj.files;
		for (var i = 0; i < files.length; i++) {
			var file = files[i];
			var imageType = /image.*/; //이미지 파일일경우만.. 뿌려준다.
			if (!file.type.match(imageType))
				continue;
			var prevImg = document.getElementById("prev_" + View_area); //이전에 미리보기가 있다면 삭제
			if (prevImg) {
				preview.removeChild(prevImg);
			}
			var img = document.createElement("img");
			img.id = "prev_" + View_area;
			img.classList.add("obj");
			img.file = file;
			img.style.width = '150px';
			img.style.height = '200px';
			preview.appendChild(img);
			if (window.FileReader) { // FireFox, Chrome, Opera 확인.
				var reader = new FileReader();
				reader.onloadend = (function(aImg) {
					return function(e) {
						aImg.src = e.target.result;
					};
				})(img);
				reader.readAsDataURL(file);
			} else { // safari is not supported FileReader
				//alert('not supported FileReader');
				if (!document.getElementById("sfr_preview_error_"
						+ View_area)) {
					var info = document.createElement("p");
					info.id = "sfr_preview_error_" + View_area;
					info.innerHTML = "not supported FileReader";
					preview.insertBefore(info, null);
				}
			}
		}
	}
}

JSP/JAVA-Script/Servlet을 사용하다보면

JSP페이지에서가 아닌 서블릿에서 데이터핸들링하다가 경고창을 띄워주게 하고싶을때가 있다

그럴때 사용할수 있는 것이

Servlet에서 PrintWriter를 사용하여 HTML형식으로 출력하는 방법이다.

response.setCharacterEncoding("UTF-8");
response.setContentType("text/html; charset=UTF-8");

PrintWriter out = response.getWriter();

out.println(""); 
out.close();

PrintWriter out = response.getWriter();

를 사용할때 페이지자체가 한글깨짐현상이 발생을 하게된다.

해결방법으로 간단하게

response.setCharacterEncoding("UTF-8");
response.setContentType("text/html; charset=UTF-8");

를 위에 코딩해준후에

out.println("내용");

을 사용하게되면 페이지가 한글이깨지않는다.

1. jQuery로 선택된 값 읽기

$("#selectBox option:selected").val();

$("select[name=name]").val();

2. jQuery로 선택된 내용 읽기

$("#selectBox option:selected").text();

3. 선택된 위치

var index = $("#test option").index($("#test option:selected"));

4. Addoptions to the end of a select

$("#selectBox").append("<option value='1'>Apples</option>");

$("#selectBox").append("<option value='2'>After Apples</option>");

5. Addoptions to the start of a select

$("#selectBox").prepend("<option value='0'>Before Apples</option>");

6. Replaceall the options with new options

$("#selectBox").html("<option value='1'>Some oranges</option><option value='2'>MoreOranges</option>");

7. Replaceitems at a certain index

$("#selectBox option:eq(1)").replaceWith("<option value='2'>Someapples</option>");

$("#selectBox option:eq(2)").replaceWith("<option value='3'>Somebananas</option>");

8. 지정된 index값으로 select 하기

$("#selectBox option:eq(2)").attr("selected", "selected");

9. text 값으로 select 하기

$("#selectBox").val("Someoranges").attr("selected", "selected");

10. value값으로 select 하기

$("#selectBox").val("2");

11. 지정된 인덱스값의 item 삭제

$("#selectBox option:eq(0)").remove();

12. 첫번째 item 삭제

$("#selectBox option:first").remove();

13. 마지막 item 삭제

$("#selectBox option:last").remove();

14. 선택된 옵션의 text 구하기

alert(!$("#selectBox option:selected").text());

15. 선택된 옵션의 value 구하기

alert(!$("#selectBox option:selected").val());

16. 선택된 옵션 index 구하기

alert(!$("#selectBox option").index($("#selectBox option:selected")));

17. SelecBox 아이템 갯수 구하기

alert(!$("#selectBox option").size());

18. 선택된 옵션 앞의 아이템 갯수

alert(!$("#selectBox option:selected").prevAl!l().size());

19. 선택된 옵션 후의 아이템 갯수

alert(!$("#selectBox option:selected").nextAll().size());

20. Insertan item in after a particular position

$("#selectBox option:eq(0)").after("<option value='4'>Somepears</option>");

21. Insertan item in before a particular position

$("#selectBox option:eq(3)").before("<option value='5'>Someapricots</option>");

22. Gettingvalues when item is selected

$("#selectBox").change(function(){

           alert(!$(this).val());

           alert(!$(this).children("option:selected").text());

});

출처 : http://blog.daum.net/twinsnow/124