728x90
반응형

Front/JS & jQuery 454

[jQuery] .siblings()

Syntax $("선택자").siblings(); // 선택한 요소의 형제요소들을 선택한다. $("선택자").siblings("선택자"); // 선택한 요소의 형제 중에 선택자를 이용해 선택한다. Ex $('.btn-outline-primary').click(function(){ $(this).siblings().removeClass("active"); $(this).addClass("active"); }); ➡ 클릭한 요소의 형제들을 선택해서 active클래스를 제거해주고 클릭한 요소에 active클래스를 추가해준다.

Front/JS & jQuery 2022.06.06

[jQuery][datatables] columnDefs . width

Ex $('#table').DataTable({ columnDefs : [ ,{ "width": "10%", "targets": [2,3,4] } ,{ "width": "15%", "targets": [1] } ] ➡ targets로 설정된 열의 너비를 설정해준다. https://datatables.net/reference/option/columns.width columns.width columns.width Since: DataTables 1.10 Column width assignment. Description This parameter can be used to define the width of a column, and may take any CSS value (3em, 20px etc). Ple..

Front/JS & jQuery 2022.06.05

[jquery][datatables] 열너비조정 함수모음

https://www.gyrocode.com/articles/jquery-datatables-column-width-issues-with-bootstrap-tabs/ jQuery DataTables: Column width issues with Bootstrap tabs | Gyrocode.com Provides solutions to common problems with incorrect column widths for a table using jQuery DataTables and Bootstrap tabs. www.gyrocode.com 너비를 다시 계산해주는 함수가 columns.adjust() 만 알고있었는데 생각보다 다양한 함수가 있다는 것을 알게되어서 잘 설명해놓은 포스트를 첨부해놓는다.

Front/JS & jQuery 2022.06.04

[js][datatables] columns.adjust()

Syntax column.adjust() ➡ 레이아웃의 너비를 다시 계산한다. Example $('a[data-toggle="tab"]').on('shown.bs.tab', function(e){ $($.fn.dataTable.tables(true)).DataTable() .columns.adjust(); }); ➡ 부트스트랩의 탭을 사용했을 때 다른 탭을 눌러서 다른 테이블이 다시 로딩될때 datatables의 table 너비를 다시 계산하라는 명령. columns.adjust().draw() ➡ 너비를 다시 계산한 후 다시 그리라는 명령. 참조 https://datatables.net/reference/api/columns.adjust() columns.adjust() columns.adjust() ..

Front/JS & jQuery 2022.06.02

[jQuery] .trigger('click') 과 .on('click')

.trigger('click') 과 .on('click')의 차이점은 trigger는 클릭이벤트를 강제로 실행시키는 것 click말고도 여러가지 event들을 사용할 수 있다. $(selector).trigger(event,eventObj,param1,param2,...) 내가 직접실행하지 않아도 강제로 이벤트가 실행된다. https://www.w3schools.com/jquery/event_trigger.asp jQuery trigger() Method W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, ..

Front/JS & jQuery 2022.05.31

[jQuery] .attr() .prop() 차이

https://devlogofchris.tistory.com/58 [$,JQuery] .attr()과 .prop()의 차이점 [jQuery] .attr() 과 .prop() 의 차이 jQuery 를 사용하다 보면 태그들의 속성값을 정의하거나 가져오기 위해 .attr() 함수를 사용하는 경우가 많을 것이다. 그런데 jQuery 1.6 이후 부터 .attr() 함수가 용.. devlogofchris.tistory.com 동적으로 생성한 selectbox를 조건에 따라 selected 속성을 주는 요소를 변경시키는 이벤트를 주어야 했는데, 적용이 처음 로딩시에만 되고 작동을 하지 않아서 구글링을 해보니 jQuery 1.6이후부터 .attr() 함수가 용도에 따라 attr()과 .prop()으로 분리된다고 되어..

Front/JS & jQuery 2022.05.30

[jQuery] [error]동적으로 selectbox selected옵션 추가할 때 에러

동적으로 selectbox를 생성하고 선택하는 것에 대한 게시글은 이미 포스팅 해둔 것이 있다. https://imswengineer.tistory.com/144 [jQuery] 동적으로 selectbox만들기 , selected 속성 추가하기 ⭐동적으로 selectbox 만들기 result.result.forEach((code)=>{ $('#' + formId) .append( $(' ', { value : code['CODE_ID'] }).text(code['CODE_NM']) ); if(code.CODE_ID == "3"){ $('#' + formId).find('optio.. imswengineer.tistory.com 이것을 프로젝트에서 사용하다가 selected옵션의 checked되는 요소가 ..

Front/JS & jQuery 2022.05.26

[JS] 빈 배열로 초기화하기

1. 빈배열 할당하기 let arr = [1, 2, 3]; arr = []; document.write('arr : ' + arr);// arr : (빈 배열) 2. 배열의 길이 설정으로 초기화하기 let arr = [1, 2, 3]; arr.length = 0; document.write('arr : ' + arr);// arr : (빈 배열) 3. splice() 사용 let arr = [1, 2, 3]; arr.splice(0); // 시작인덱스부터 끝까지 삭제한다. document.write('arr : ' + arr); // arr : (빈 배열) splice() 함수 - 3개의 파라미터를 입력 받는다. ✅ 첫번째 파라미터 : 배열에서 변경을 시작할 index ✅ 두번째 파라미터 : 입력된 숫자..

Front/JS & jQuery 2022.05.23
728x90
반응형