Spring/JavaScript+Jsp(HTMl)39 [JavaScript] textarea 글자수 제한 / byte 제한 프로젝트를 하다보면 글자수를 제한할때가 있다. 특히 textarea에 길이 제한을 하는 경우가 많다. textarea 글자수 제한 / byte 제한에 대한 내용을 예제를 통해 알아보자! 1000자 이상은 입력은 제한하는 예제이다. [ HTML ] 입력해주세요. 0 1000bytes maxlength="1000"를 통해서 일단 1000자를 넘을 걸 미리 방지해두자. maxlength를 쓰면 해당 길이까지만 적을 수 있다. onKeyUp을 사용하여 키보드가 올라갈때 함수를 실행하게하자. [ JS ] //글자수 제한 함수1 //한글과 영문/숫자등은 byte수가 다르니 각자 체크후 byte에 맞춰서 제한 function fnChkByte(obj, maxByte){ var str = obj.value; var s.. 2022. 10. 27. [jQuery] 체크박스 선택 및 해제하기 (attr, prop 차이 / 부모의 자식요소들 찾아서 전체 해제하는 법) checkbox를 선택 및 해제하는 방법에 대해서 포스팅할 거다. 1. attr() $(selector).attr('checked', 'checked'); //체크 $(selector).removeAttr('checked'); //체크해제 HTML 속성을 취급한다. 처음 한번은 체크가 잘되고 해제되지만 이후엔 발동하지않는다. (비추) 2. prop() $(selector).prop('checked', true); //체크 $(selector).prop('checked', false); //체크 해제 JS프로퍼티를 취급한다. 예제 [ html ] YES NO [ JS ] function Chktest(el) { //현재요소의 부모를 찾고 부모의 자식인 INPUT을 찾아서 체크 전부 해제 $(el).clos.. 2022. 10. 7. [jQuery] 자식 요소 찾기 (children, find) 가끔 특정 자식 객체를 가져와야 하는 경우가 있다. 매번 까먹어서 검색하는 나를 위해서 포스팅한다. 1. children - 자식 요소만 탐색 2. find - 자식 및 하위 태크 모두 탐색 1. children $(selector).children(selector) 자식 요소를 탐색할 때 사용 2. find $(selector).find(selector) 자식 및 하위 태그 모두 찾을 때 사용 예제 [ html ] 첫번째 두번째 - ul을 기준으로 자식 태그에 있는 li 태그를 찾고 싶을 때 - children() $('ul').children('li'); // return 'li' 배열(li 두개) // 첫번째 li를 찾을때 $('ul').children('li:eq(0)'); /return 첫번째 .. 2022. 10. 7. [jQuery] 상위(부모) 요소 가져오기 (parents, closest) 가끔 특정 상위 객체를 가져와야하는 경우가 있다. 매번 까먹어서 검색하는 나를 위해서 포스팅한다. 부모(상위) 요소 가져오는 방법 2가지가 있다. 1. parents 2. closest 1. parents 함수 사용 $(selector).parents(selector) parents 함수는 parents 인자값으로 잡히는 모든 상위 요소를 반환한다. 예를들자면, 예제 HTML 코드처럼 div 태그가 중첩되어 있을때 parents()를 실행하면 결과 객체는 배열이 나온다. 즉, 셀렉터selector로 잡히는 모든 상위 요소를 반환한다. - 예제 [ html ] [ js ] $("#test").parents("div") [ 결과 ] 반환된 배열에는 parent1, parent2 존재한다. 2. closest.. 2022. 10. 7. [ CSS ] display:none 과 visibilit:hidden 차이점 css속성 중 영역을 숨기는 기능인 display:none와 visibilit:hidden를 사용한다. 2개의 속성에 대해서 차이점을 알아보자! display:none 여백을 남기지 않고 숨겨진다. visibility:hidden 여백을 남긴 채 숨겨진다. 예제 [ html ] Normal DIV01 DIV02 DIV03 Display none DIV01 DIV02 DIV03 Visibility hidden DIV01 DIV02 DIV03 [ 결과 ] display none을 하면 여백 없이 지워진 걸 볼 수 있다. visibility hidden을 하면 여백이 남겨져있는 걸 볼 수 있다 2022. 7. 18. 이전 1 2 3 4 5 6 7 8 다음 728x90
