JSP/JQUERY (13) 썸네일형 리스트형 [JQUERY] 화면호출시 사용되는 매서드 ready() 화면 호출전에 기능구현이 필요 할 경우 사용되는 매서드 $(document).ready(function){ //처음 화면 호출시 //기능구현 }); 아래와 같이 변경하여 사용가능 $function(){ //기능구현 }); [JQUERY] 문자열 Masking (prototype이용) 날짜에 대한 Masking처리 예제 (js파일에 구현후 여러 jsp에서 사용 권장) JS String.prototype.dateMasking = function(){ //dateMasking은 변수명 if(this.length == 0){ return " ";} //공백일 경우 처리 var separator = "-" || argument[0]; return this.substring(0,4) + separator + this.substring(4,6) + separator + this.substring(6,8); } SCRIPT $("#id").val().dateMasking(); $(function ({ //id가 aa인 항목의 값에 id가 bb인 항목을 Masking처리 후에 삽입 $("#aa".. [JQUERY] 화면상의 항목 전체 확인 주로 validation 처리시에 사용되는 예제 $(".input_num, #regdt", form).filter(":visible").each(function(i,o){ //확인로직 삽입위치 $(o).val(" "); //object의 값을 " "로 변경 }); .input_num: 클래스명 regdt: 항목 ID form: document.form명 :visible: 화면에 보이는 항목 의미 [JQUERY] 테이블 마우스오버 컬러표시 table mouseover 컬러표시 예제 [JQUERY] footer/div 하단 고정 (스크롤바 이동시 동적으로 변경) footer 하단고정 예제 HTML 하단 필요내용을 입력 CSS footer { position: fixed; z-index: 30; } SCRIPT [JQUERY] 테이블 td 병합 (rowspan) 동적으로 row병합하는 예제 HTML SCRIPT $(window).load(function () { $(".row_merge").each(function () { var rows = $(".row_merge:contains('" + $(this).text() + "')"); if (rows.length > 1) { rows.eq(0).attr("rowspan", rows.length); rows.not(":eq(0)").remove(); } }); }); [JQUERY] INPUT 합계 구하기 class가 동일한 항목 합계 산출 예제 HTML SCRIPT $('.money1').blur(function () { var seip = 0; $('.money1').each(function(){ //클래스가 money인 항목의 갯수만큼 진행 seip += Number($(this).val()); }); //합계를 출력 $("#seipSum").val(seip); //seipSum에 30입력 }); [JQUERY] .attr() .prop() 차이 .attr, .prop 사용상의 차이 (jquery 1.6 이상부터 구분) attr: 속성을 조회하거나 변경 prop: true/false 값을 가지는 속성 조회하거나 변경 .attr .prop 예제 input type이 hidden인 항목을 submit으로 변경 id가 chk인 항목의 체크박스를 체크 $('#deleteBtn').attr('type', 'submit'); $('#chk').prop('checked', true); 이전 1 2 다음
