JavaScript(12)
-
[DataTables] 정렬 비활성화, 정렬 지정하기
DataTables 에서는 첫 번째 컬럼 기준 ASC(오름차순 정렬)가 활성화되어 있습니다. 이때 정렬 기능을 비활성화하고 싶을 땐 aaSorting 옵션의 값을 [] 로 주면 됩니다. 1 2 3 4 5 $(function(){ $('#data').dataTable({ aaSorting : [] }); }); cs ㅇ 설정 뒤에는 기존 데이터 순서대로 적용됨을 알 수 있습니다. 만약 다른 컬럼 기준으로 정렬을 하고 싶다면 order ([[정렬할 컬럼, 정렬방법]]) 옵션을 주면 됩니다. 1 2 3 4 5 6 $(function(){ $('#data').dataTable({ aaSorting: [], order : [[ 0, "desc" ]] }); }); cs
2022.02.04 -
[Javascript] var, const, let 변수 선언 차이
javascript 변수의 선언 방법은 var, const, let 3가지가 있습니다. 각각의 차이점에 대해 알아보겠습니다. var var는 변수 선언 뒤 재선언을 해도 결과값이 에러없이 출력됩니다. 어떻게 보면 재선언 기능이 장점으로 보일 수 있겠지만 같은 변수명을 계속 사용할 경우 이미 선언한 변수값이 사라지는 문제가 발생해 치명적인 단점으로 작용할 수도 있습니다. let let은 재선언은 불가하지만 재할당이 가능합니다. 아래와 같이 재선언한 경우 에러 메시지를 출력합니다. 재할당한 경우는 제대로 출력되는 걸 볼 수 있습니다. const const는 재선언, 재할당이 모두 불가합니다. 먼저 재선언한 경우 let과 동일하게 에러 메시지를 출력합니다. 다음으로 재할당한 경우입니다. 처음 선언한 "hell..
2021.08.18 -
[jQuery] textarea 글자 수 제한
jQuery를 이용해서 의 글자수 제한을 둬 해당 글자수가 넘어가게 되면 alert를 띄워 더 이상 쓰지 못하도록 해보겠습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 textarea 글자수 제한 $(document).ready(function() { // textarea 글자 수 제한 $('#content').on('keyup', function() { if($(this).val().length > 10) { alert("최대 10자까지 입력 가능합니다."); $(this).val($(this).val().substring(0, 10)); } }); }); Colored by Color Scripter cs 먼저 jQuery 를 사용하기 위..
2021.08.13 -
[Javascript] 중첩 for문, 이중 for문을 이용해 구구단 출력하기
for문 안에 for문이 들어가 있는 형태로 간단한 예제를 통해 알아보겠습니다. 아래 예제는 1~6학년을 출력하고 각 학년마다 5반까지 출력하도록 했습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 중첩 for문 for(var i = 1; i
2021.08.10 -
[jQuery] 페이지 로드 후 특정 div 이동하기
jQuery를 이용해서 웹페이지가 로드 됐을 때 특정 div 로 이동하는 방법을 알아보겠습니다. 아래 소스는 태그 안에 태그를 넣어 red, orange, yellow 색에 해당하는 jpg 이미지 파일을 지정했습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 javascript focus Colored by Color Scripter cs 웹브라우저로 열어보면 아래와 같은 구조를 갖고 있고 이 경우는 마우스로 스크롤을 내렸습니다. 이 상태에서 태그를 추가하겠습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 javascript focus $(document).ready(function ..
2021.08.09 -
[Javascript] checkbox checked 갯수 제한두기
checkbox input type 중 하나로 기본 형태는 사각형 모양으로 마우스 클릭을 하게 되면 배경색이 파란색으로 바뀌면서 체크 표시가 뜨게 됩니다. 회원가입이나 쇼핑을 할 때 등등 쉽게 볼 수 있는 input type 인데요. 오늘은 여러 개의 checkbox 중에서 특정 갯수 이상으로 체크되지 않도록 script code를 짜보겠습니다. 소스와 함께 간략한 설명을 주석으로 달았습니다. 위 소스에선 if문으로 checkbox가 2개까지 체크되도록 했고 3개를 체크하려는 순간 alert 함수로 경고창이 뜨면서 체크가 되지 않도록 했습니다.
2021.07.29