메뉴 건너뛰기

?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

제이쿼리 선택자에 대한 자세한 설명은 생략하고


바로바로 카피 & 페이스트 할 수 있도록 작성되었다.


자주 쓰이는 혹은 좋은 방법들은 계속 업로드 됩니다.





커서 변경

$('body').css('cursor', 'default');

$('body').css('cursor', 'wait');



해당 ID로 지정된 HTML 보이기/숨기기

$("#placeholder").show();

$("#placeholder").hide();



SelectBox 의 Option 값 확인

$("#search_sale_unit").find("option").each(function() {
 alert(this.value);
});



SelectBox 의 첫번째 옵션 값

$("#_CD > option:first").val();



SelectBox 에서 선택된 Value 찾기

$('#search_sale_pernr_s option:selected').val();



SelectBox 에서 선택된 Text 찾기

$('#search_sale_pernr_s option:selected').text();



Select Box의 특정 값을 가지는 Option 삭제하기

$("#csf_menu_no").find("option").each(function() {
 if(this.value == "4") {
  //alert(this.selected);
  $(this).remove();
 }
});



SelectBox 특정 value값 제외하고 나머지 옵션 삭제

$("[name='네임값'] option").not("[value='특정value']").remove();



SelectBox의 특정 값 이후/이전에 Option 추가하기

$("#csf_menu_no").find("option").each(function() {
 if(this.value == "3") {
  $(this).after("<option value=\"4\">텍스트</option>");
  //$(this).before("<option value=\"4\">텍스트</option>");
  return false;
 }
});



Select Box의 모든 Option 삭제 후 Default Option 추가하기

$("#search_sale_pernr_s").find("option").remove().end().append("<option value=\"\">::사원 선택::</option>");



선택되지 않은 SelectBox 값 삭제

$("[name=네임값] option").not(":selected").remove();



innerHTML값 Setting하기

$("#id_total_price").html("<strong>값</strong>");



ID로 지정된 Form Submit 하기

$("#csf_tab_menu_form").attr("target", "_top");

$("#csf_tab_menu_form").attr("action", "/sabisung/list.jsp");

$("#csf_tab_menu_form").submit();



each Loop에서의 break/continue 방법

$("#csf_menu_no").find("option").each(function() {
 if(this.value == "3") {
  return false; //break 의미
  return true; //continue 의미
 }
});



checkbox 의 전체 갯수와 선택된 갯수 구하기

- 전체 갯수 : $("input:checkbox[name=is_check]").length

- 선택된 갯수 : $("input:checkbox[name=is_check]:checked").length

- 전체 체크 : $("input[name=mycheck]:checkbox").prop("checked", true);

- 전체 checkbox 순회하기

$("input:checkbox[name=is_check]").each(function() {
 this.checked = true;
});



checkbox의 체크 여부 확인

if($("input:checkbox[name=complete_yn]").is(":checked") == true) {
  //작업
}



id 가 viewyn_로 시작하는 모든태그, 끝나는 것은 ^= 대신에 $=
$("[id^='viewyn_']").each(function(i) {
 $(this).val();
});



Table의 타이틀 Row를 제외한 모든 Row 삭제하기

$("#data_list_table > tbody").children("tr:not(:first)").remove();



Table의 특정번째 Row이후 모든 Row 삭제하기

$('#tableId tr:gt(0)').each(function (i){ // 0번째 이후 Row 삭제
    $(this).remove();
 });


 

Table에 Row 를 html Text로 만들어서 추가하기

$('#TableId).append(html Text);



Table의 마지막 Row 다음에 Row 추가하기

$("#data_list_table > tbody:last").append("<tr><td>값1</td></tr>");



Table의 특정(ID를 가지는) TR 다음에 TR Row를 추가하기

$("#table_appr_pernr > tbody").children("tr").each(function() {
 if(("row_appr_pernr_" + row_no) == $(this).attr('id')) {
  $(this).after("<tr><td>사비성</td></tr>");
  return false;
 }
});



Table의 특정(ID를 가지는) TR Row를 삭제하기

$("#table_appr_pernr > tbody").children("tr").each(function() {
 if(("row_appr_pernr_" + row_no) == $(this).attr('id')) {
  $(this).remove();
  return false;
 }
});



input radio 선택된 value 값 가져오기

$("input:radio[name=radioName]:checked").val()



선택된 input radio text 값 가져오기

<html>
 <input name="radioName" id="id1" type="radio" value="1" checked="checked"><label for="id1">개인회원</label><br/>
</html>

$("input:radio[name=radioName]:checked").next().text()




부모창의 태그 선택자

$("#id", opener.document).val();

 

 

 

자식 태그 선택자

$("div").children(); 또는

$("div").children("a");

li의 루프를 돌면서 그 자식인 A 태그를 찾을 때 사용했음

$("ul li").each(function(){

   var aTag = $(this).children("a");

}); 

 


List of Articles
번호 제목 날짜 조회 수
119 jQuery 실행패턴 2017.03.02 6681
118 jQuery 예약어 $ 를 사용하지 못하는 경우 해결책 noConflict() 2016.09.21 6679
117 체크박스 또는 라디오 버튼의 체크여부 변경하기 2016.09.21 6667
116 슬라이드 쇼 file 2016.09.21 6611
115 jquery 뒤로가기 2016.11.17 6511
114 다른 프레임에 있는 객채 참조하는 방법 2016.09.21 6471
113 scrolling to top 2016.12.22 6470
112 load() 메소드 2016.09.21 6412
111 디자인 셀렉트 박스 & CSS 2016.12.22 6347
110 금액단위 제거 표기 2016.12.22 6217
109 jquery css div, li 리스트 선택한 메뉴 변경 출처: http://okkks.tistory.com/1062 [이건없지] file 2017.07.05 5794
108 jquery - select option 선택값 가져오기 2018.09.06 5330
107 jquery 체크박스 배열 처리. 변수 하나에 담기. 2018.07.04 4657
106 특정영역 제외하고 body 클릭 2018.09.28 3605
105 jQuery 유효성 검사 2018.07.04 3362
104 jQuery 기초 (txt 파일 가져오기 (load) , 클릭시에 배경색을 변경(json)) file 2019.01.16 3224
103 jquery 드래그 앤 드롭 파일 업로드 2019.05.21 3085
102 드래그 & 드랍 구현 - on()[이벤트리스너] file 2018.09.06 2888
101 jquery 팝업 차단 없이 띄우기 2019.03.05 2855
100 [jQuery] 확인 창(confirm), 페이지 이동(location.replace) 2018.09.06 2649
Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved