본문 바로가기

SW/JQUERY

(7)
[JQUERY] input id 또는 name으로 검색할때 like 검색 보통 이름이 있을 때 $('select[id=""]').val("${defaultListRowCnt}"); 뭐 이런식으로 사용하는데 동적으로 생성되서 id나 name값이 여러개일때 Like검색처럼 id값을 찾을 수 있다. ^이걸 사용하는 경우 rowPerPage로 시작하는 id를 찾는것이고 $를 사용하는 경우 rowPerPage로 끝나는 id를 찾는것이다. $('select[id^="rowPerPage"]').val("${defaultListRowCnt}"); $('select[id$="rowPerPage"]').val("${defaultListRowCnt}"); 이렇게 !
[Jquery UI] Datepicker 간단 사용법 Jquery UI 공식사이트인 https://jqueryui.com 에서 모든 Example과 API문서를 보고, 실무에서 많이 쓰일 것 같은 내용만 손쉽게 사용 할 수 있도록 정리해보았습니다. 현재 최신 버전인 1.12.1 버전 기준입니다. 기본 설정 5~7라인에는 Jquery UI를 사용하는데 필요한 js파일과 css파일이 선언되어 있고, 13라인에는 input객체를 datepicker로 사용하겠다고 선언되어있다. 13라인이 없다면 10라인이 input은 그냥 텍스트를 입력받는 input이지만 13라인이 있다면 input을 클릭했을 때 달력이 출력되고, 날짜를 선택하면 선택한 날짜가 input에 입력된다. 일자: $("#datepicker").datepicker(); datepicker 별 옵션 설정..
백스페이스 차단(input만 허용 ) // 페이지 백스페이스 차단(text, textarea만 허용) document.onkeydown=function() { if(event.srcElement.type != "text" && event.srcElement.type != "textarea") { if(event.keyCode==8) return false; }} // 모든 input 태그에 속성 하나를 를 체크해서 그 조건으로 백스페이스 막기 $("input").each(function(index) { if ($(this).attr("속성 이름")) { $(this).bind("keydown", function(event) { if (event.keyCode == 8) return false; }); } }); ex) history.leng..
jQuery 체크박스, 라디오버튼 컨트롤 1. checked 여부 확인 $("input:checkbox[id='아이디명']").is(:checked) // true : false $("input:checkbox[name='NAME명']").is(:checked) // true : false $("input:radio[id='아이디명']").is(:checked) // true : false $("input:radio[name='NAME명']").is(:checked) // true : false 2. checked/unchecked 처리 $("input:checkbox[id='아이디명']").prop("checked", true); // 체크박스 checked $("input:checkbox[name='NAME명']").prop("checked..
체크박스 체크 이벤트 (checkBox Event) 체크박스 체크 이벤트 $(document).ready(function(){ $("#checkBoxId").change(function(){ if($("#checkBoxId").is(":checked")){ alert("체크"); } else{ alert("체크 해제"); } }); }); 체크박스 체크/체크 해제 하기 //체크박스 체크하기 $("input:checkbox[id='checkBoxId']").prop("checked", true); $("#checkBoxId").prop("checked", true); //체크박스 체크 해제 하기 $("input:checkbox[id='checkBoxId']").prop("checked", false); $("#checkBoxId").prop("checked..
jQuery에서 부모창 제어/접근(opener, parent) jQuery 자식 팝업 창에서 부모창 컨트롤 $(opener.document).find("#Form").attr("action","index.do").submit(); 자식창 -> 부모창으로 값 전달하기 -opener.document.getElementById("id").value="value"; //dom 객체로 제어 $("#id",opener.document).val("value"); // jQuery 방식 1 $("input[name=imgFile]", parent.document.body).val() // 방식 2 $(opener.document).find("#id").val("value"); //방식 3 -opener.location.href="javascript:fun();"; //일반적인 방..
[JQUERY] .slideToggle()로 객체를 말아올리거나 서서히 펼치는 예제 jQuery의 .slideToggle()은 객체를 말아올리거나 펼치는 효과를 낸다. .slideToggle()의 형식은 아래와 같다. ...더보기 .slideToggle( [움직임 시간(duration)] [, 움직이고 나서 실행할 함수(callback)] ) .slideToggle( [움직임 시간(duration)] [, 늦춤 함수(easing)] [, 움직이고 나서 실행할 함수(callback)] ) 움직임 시간은 밀리초(ms) 단위로 넣거나 slow, normal, fast를 쓸 수 있다. 아래는 jQuery로 단추(button)를 딸깍하면 상자(div)가 펼쳐져 있으면 말아올려서 접고, 접혀 있으면 천천히 펼쳐내리는 예제이다. ...더보기 딸깍해 보세요 말아올리고 말아내리는 글상자 단추로 쓸 객체..