JQuery45 [자바스크립트] javascript 정규식으로 Html 태그 제거하기 다음 정규식 스크립트로 Html 태그를 제거합니다.(]+)>) 아래처럼 Html 태그를 제거하는 함수를 만들어 사용하시면 됩니다.function removeTag( html ) { return html.replace(/(]+)>)/gi, ""); } 2015. 3. 23. [jQuery]제이쿼리에서 이벤트핸들러의 함수를 강제(자동으)로 실행하는 trigger 명령어 $("[name=textStr]").trigger("focus"); name=textStr 인 객체의 focus() 이벤트를 발생시키라는 명령입니다. 즉, trigger("이벤트명")으로 어떤 이벤트든 해당 객체의 이벤트를 발생시킬 수가 있습니다. 자동으로 부모창이나 팝업창의 버튼을 클릭하고 싶을 때 사용하면 편리합니다. 다른 사람이 만든 소스의 해당 객체의 이벤트를 발생하면 어떤 명령이 실행되는지 잘 모를 때 실행하면 아주 편리합니다. 위 예제에서는 버튼을 클릭하면 inputbox의 focus() 이벤트를 강제 실행하고 있습니다. 2015. 1. 22. [jQuery] 제이쿼리에서 json 변수 사용(활용)법 jQuery에서 json 변수를 사용하는 방법은 마치 자바스크립트 배열을 사용하는 것처럼 간단하고 편리합니다. push() 메소드를 이용해서 변수를 원하는대로 넣을 수 있습니다.jsonObj.push({ grade: "1학년", name: "김철수", number: "1번", height: "177cm", ... }); json 변수의 값을 가져올 때는 .grade, .name, .number 처럼 속성만 표시하면 됩니다.for(i = 0; i < jsonObj.length; i++) { jsonObj[i].grade +" "+ jsonObj[i].name +" "+ jsonObj[i].number } 각 index 별로 호출하려면 jsonObj[0].grade, jsonObj[1].grade, json.. 2014. 12. 24. [jQuery] .clone()으로 Dom 요소 복사하기 $(document).ready(function() {$( "b" ).clone().prependTo( "p" );}); $(document).ready(function(){...}); => 화면이 모두 로드되고 이미지를 불러오기 전에 실행하라는 뜻입니다. $( "b" ).clone() 은 b 태그 요소를 복사하라는 뜻입니다. prependTo( "p" ) 는 p 태그 요소 앞에 추가하라는 뜻입니다. 안녕! 좋은하루 되세요. 이렇게 구현돼 있던 게 $( "b" ).clone().prependTo( "p" ); 이 명령이 실행됨으로 아래처럼 구현이 됩니다.안녕!안녕! 좋은하루 되세요. 2014. 12. 6. [jQuery] 제이쿼리로 필드를 포함한 플레이스홀더(placeholder) 텍스트 만들기 예제 3 2014/12/05 - [프로그래밍 언어/jQuery] - jQuery로 필드를 포함한 플레이스홀더(placeholder) 텍스트 만들기 예제 1 2014/12/05 - [분류 전체보기] - jQuery로 필드를 포함한 플레이스홀더(placeholder) 텍스트 만들기 예제 2 먼저, 위 예제들을 확인하세요. $("#search").submit(function(){ if($("#searchText").val() == searchLabel) { $("#searchText").val(""); } }); inputbox에 아무것도 입력하지 않고 submit 버튼을 눌렀을 때, '사이트 검색'이라는 단어가 넘어가지 않도록 구현을 하는 소스입니다. 아무것도 입력하지 않았을 때 '사이트 검색'이라는 단어를 inpu.. 2014. 12. 5. [jQuery] 제이쿼리로 필드를 포함한 플레이스홀더(placeholder) 텍스트 만들기 예제 1 jQuery로 작성된 자바스크립트 부분을 빼면 다음과 같이 화면에 보여집니다. '사이트 검색'이라는 부분을 inputbox에 넣어보는 예제입니다. $(document).ready(function() { var searchLabel = $("#search label").remove().text(); $("#searchText").addClass("placeholder").val(searchLabel); });$(document).ready(function() {...} 에 코딩을 하면 화면이 로딩되자마자 실행이 됩니다. var searchLabel = $("#search label").remove().text(); => label에 있는 텍스트인 '사이트 검색'이라는 값을 searchLabel이라는 변수에.. 2014. 12. 5. [jQuery] 제이쿼리로 전체선택/선택해제 간단하게 구현해 보는 예제입니다. function checkAllFunc(obj) { $("[name=chk]").each(function() { this.checked = obj.checked; }) } 체크박스가 [name=chk]로 이름이 같기 때문에 each()문으로 루프를 돌리며 작업을 합니다. this.checked = obj.checked; => 전체선택 체크박스가 선택되면 다른 체크박스도 체크하고, 전체선택 체크박스가 선택해제되면 다른 체크박스도 선택해제하는 명령입니다. 전체선택 onclick="checkAllFunc(this)" => 전체선택의 체크박스를 클릭할 때 checkAllFunc ()함수를 실행해 달라는 명령입니다. 2014. 12. 5. [jQuery] 글자 폰트 사이즈 늘리고 줄이기, 숨기고 보이기, 애니메이션으로 버튼 크기 조절하는 예제 먼저, 아래 링크를 클릭해서 이전 예제를 참조하세요. 2014/12/03 - [프로그래밍 언어/jQuery] - 글자 폰트 사이즈 늘리고 줄이기 예제 2014/12/03 - [프로그래밍 언어/jQuery] - 글자 폰트 사이즈 늘리고 줄이기, 숨기고 보이기 예제 $("div.label").click(function() { $("div.button") .fadeTo("slow", 0.5) .animate({width:400}, "slow") .fadeTo("slow", 1.0) .animate({height:38}, "slow"); });$("div.button") 은 을 찾는 selecter 입니다. fadeTo() 로 서서히 나타나는 효과를 구현했구요. animate() 으로 버튼의 너비와 높이가 늘어.. 2014. 12. 3. [jQuery] 글자 폰트 사이즈 늘리고 줄이기, 숨기고 보이기 예제 먼저, 아래 링크를 클릭해서 이전 예제를 참조하세요.2014/12/03 - [프로그래밍 언어/jQuery] - 글자 폰트 사이즈 늘리고 줄이기 예제 .more { color: blue; font-size: 25px; font-weight: bold; text-decoration: underline; } 말줄임표(...)에 스타일시트에 more 클래스를 정의합니다. $("p:eq(1)").hide(); /* 태그 중 첫번째 객체를 숨긴다. */ $("span.more").click(function() { $("p:eq(1)").show('slow'); $(this).hide('slow'); }); show()는 객체를 보이게 하고, hide()는 숨기는 명령입니다. show('slow')는 객체를 천천히 .. 2014. 12. 3. [jQuery] 글자 폰트 사이즈 늘리고 줄이기 예제 .label { font-weight: bold; /* 글자를 진하게 */ font-size: 12pt; margin: 20px 0; /* 바깥 위아래 여백을 20px 준다. */ } .button { width: 200px; border: 1px solid #CCCCCC; /* 테두리를 1px크기의 실선으로 #CCCCCC 색깔로 입힌다. */ background-color: #EEEEEE; /* 배경색 */ padding: 2px; margin: 10px 0; } 스타일시트에 label과 button 클래스를 정의합니다. $(document).ready(function() { $("div.button").click(function() { var $speech = $("div.speech"); var c.. 2014. 12. 3. [jQuery] 행에 징검다리 스타일 입히기 (:odd, :even) .odd { background-color: #FFC;/* 홀수번째 줄은 연한 노란색 */ } .even { background-color: #CEF;/* 짝수번째 줄은 연한 푸른색 */ }스타일시트에 odd, even 클래스를 정의합니다. 각각, 홀수와 짝수 행에 적용할 클래스입니다. $(document).ready(function() { $("tr:odd").addClass("odd"); $("tr:even").addClass("even"); $("td:contains('헨리')").addClass("highlight"); });DOM이 로드되고 이미지가 로드되기 전에 $(document).read() 함수가 실행됩니다. 홀수행(tr:odd)에 odd 클래스를 적용하고, 짝수행(tr:even)에 ev.. 2014. 12. 3. [jQuery] 리스트 항목에 레벨 단위로 스타일 입히기 (UL, LI 태그) .horizontal { float: left; /* 좌측 정렬 */ list-style: none; /* 목록 앞의 글머리 기호 표시를 제거한다. */ margin: 10px; /* 요소의 모든 가장자리에 10 픽셀의 여백을 준다. } 스타일시트에 horizontal 클래스를 정의합니다. $(document).ready(function() { $("#selected-plays > li").addClass("horizontal"); }); DOM이 로드되고 이미지가 로드되기 전에 $(document).read() 함수가 실행됩니다. selected-plays를 ID값으로 가지는 요소에 horizontal 클래스를 적용하라는 명령입니다. 2014. 12. 3. [jQuery] ajax로 값을 가져올 때 UTF-8 환경에서 한글깨짐 해결하기 - 자바(java) 요즘은 한글 뿐만이 아니라 국제화를 위해 다국어를 지원하기 위해 UTF-8 인코딩 상태에서 개발을 하는 경우가 많죠. 저도 어느 프로젝트를 가든 UTF-8로 작업을 하게 되는데요. 예전엔 iframe으로 숨겨서 작업하던 걸 요즘엔 jQuery ajax로 많이 작업을 합니다. 자, 그런데, UTF-8에서 ajax를 사용하다보면 한글깨짐 현상이 발생하게 됩니다.이렇게 한글이 깨지는 이유는 무엇인지 해결방법은 무엇인지 알아보겠습니다. ajaxTest.jsp123456789$.ajax({ type: "post", url: "ajaxTestJson.do", data: param, dataType: "json", success: function (jsonObj) { alert( jsonObj.ajaxName ); .. 2014. 10. 29. [jQuery] 제이쿼리 API http://remysharp.com/jquery-api/ http://v.daum.net/link/15532070 2011. 5. 24. [jQuery] 제이쿼리로 ajax 호출시 로딩중 이미지 보여주기 jQuery로 ajax 호출시 로딩중 이미지를 띄워주려면 어떻게 할까? 바로 이런 화면을 구현해 볼까한다. [호출] 버튼을 클릭하면 구구단 1단을 ajax로 불러오고 불러오는 동안 '로딩중' 이미지를 보여준다.자, 그럼.. 먼저 index.html 페이지를 만들어보자. 구구단 1단을 호출하자. ~ 사이에 위와 같이 모양을 만들고 사이엔 다음과 같이 넣어서 로딩이미지의 위치 및 투명도를 조절해보자.123456789cs [호출] 버튼을 클릭하면 fLoadData() 라는 함수가 호출되는데, 이 함수가 ajax로 데이타를 불러오는 부분이다. 사이에 자바스크립트를 추가해보자.123456789101112131415161718 function fLoadData() { $.ajax({ type: "POST", url.. 2010. 10. 14. 이전 1 2 3 다음
