개발자의 끄적끄적

[javascript/jquery] jquery checked 사용법 및 예제 jquery를 이용하여 체크박스 혹은 라디오의 체크 유무를 확인하는 방법입니다. $("input:radio[id='태그아이디']").is(":checked") == true 위 예제를 보시면 아시겠지만, $("input:radio[id='ID']").is(":checked") 를 찍어보면 true / false 가 나올테니 그걸 활용해서 체크할지 말지 등등의 로직을 만들면 됩니다! 위 예제는 아이디지만, [id='태그아이디'] 자리에 [name='태그네임'] 이런식으로 변경해서 name으로 체크도 가능합니다! 참고하세요!

[javascriptjquery] jquery 선택자 종류 및 사용법 jquery 에서 태그 / 클래스 / 아이디 / 현재 선택된 요소를 선택하고 사용할때 쓰이는 명령어 입니다. $("태그명") // 태그명과 동일한 모든 태그를 선택 $(".클래스명") // 클래스명과 동일한 모든 태그를 선택 $("#아이디") // 아이디라는 id를 가진 태그를 선택 $(this) // 현재 선택된 태그를 사용할때 위 내용에 나와있듯이, 특정 태그들을 다 선택하거나, 특정 클래스를 다 선택하거나, 특정 아이디값을 가진 태그를 선택하거나, 현재 선택된 요소를 이용하거나 할때 사용됩니다. 참고하세요!

[javascript/jquery] jquery 마우스 이벤트 제어 함수 jquery 에서 키보드 이벤트 말고 마우스 이벤트도 자주 제어를 합니다. 그럴때 사용 하는 jquery 함수입니다. mousedown() // 마우스를 눌렀다가 때면 반응 mouseenter() // 마우스가 영역안으로 들어왔을때 반응 mouseleave() // 마우스가 영역에서 벗어났을때 반응 mousemove() // 마우스가 영역안에서 움직일때 반응 mouseover() // 마우스를 영역에 올려놨을때 반응 mouseup() // 마우스를 영역에서 눌렀을때 반응 위 내용보시면 아시겠지만, 마우스가 영역에 들어오거나, 클릭이 발생하거나, 영역을 벗어나거나 하는 이벤트들을 제어할 수 있습니다. 내용이 약간씩 다르므로 꼭 테스트..

[javascript/jquery] jquery 키보드 이벤트 함수 input 태그에서 키보드 입력이 될때마다 검색을 한다든가, 유효성 검사를 한다든가 하는 일이 많습니다. 그럴때 사용할수 있는 jquery 키보드 이벤트 함수입니다. keydown() // 키보드를 누를때 반응 keyup() // 키보드를 눌렀다가 뗄때 반응 keypress() // 글자가 입력될때 반응 위 내용처럼 키보드를 누를때 바로 반응하는지, 키보드를 눌렀다가 뗄때 반응하는지, 글자가 입력되었을때 반응하는지에 따라서 구분이 됩니다. 비슷하게 보이지만 약간씩 차이가 있으므로, 확인해보고 맞는것을 골라서 사용하시면 좋을듯 합니다. 참고하세요!

[javascript/jquery] 자바스크립트 filereader 사용예제 javascript에서 동기방식으로 이미지 업로드 구현하는경우, 선택한 이미지를 사용자 화면에 미리 보여줘야 되는 경우가 있습니다. 그럴때 사용할수 있는 샘플 소스입니다. 위 내용을 보시면 아시겠지만, input file 에서 파일이 선택되면 onchange 가 동작하여 file 객체를 담아서 filereader 를 호출 및 이미지를 계산하게 됩니다. console.log 부분에 담겨있는 e.target.result 는 이미지 url 을 표시할때 사용하시면 됩니다. 사용전 테스트를 해보시고 수정하셔서 반영하셔야 할수도 있습니다! 참고하세요!

[javascript/jquery] 자바스크립트 date 를 timestamp 로 변환방법 자바스크립트에서 date 형식을 timestamp 형식으로 변환해야 할때가 있습니다. 그럴때 사용하는 방법입니다. var date_str = "2020-11-05 01:00:00"; var date_timestamp = new Date(date_str); console.log(date_timestamp); 위 예제를 보시면, date_str 이라는데 date 포맷 형태의 날짜가 들어있구요. 이걸 Date 객에 넣어서 date_timestamp 에 담습니다. 그리고 이건 console.log 로 출력하면!! timestamp 형식의 결과가 나옵니다. 여기서 주의할점은 ms 단위로 나오기때문에 초단위로 결과를 얻으려면..

[javascript/jquery] jquery select 태그 선택값 가져오기 jquery로 특정 select태그에 선택된 값을 불러올때 사용 하는 방법입니다. 아래와 같은 select 태그가 있고, 그 안의 옵션들 중에서 2에 해당되는데 선택되어진 상태라고 가정하고 1 2 위 태그의 선택값을 불러오는 예제입니다. $("#id_select option:selected").val(); // id로 값 불러오기 $("select[name=name_select]").val(); // name로 값 불러오기 위 내용을 보시면 아시겠지만 select 태그에 선언되어 있는 name 이든 id 이든 2가지 다 선택값을 불러올 수 있습니다. 참고하세요!

[javascript/jquery] jquery로 disabled 효과 적용/해제 방법 jquery로 특정 태그에 disabled 효과를 주거나 제거할때가 있습니다. 그럴때 attr을 이용하시면됩니다. 기본 사용법입니다. $("대상").attr("disabled", true); $("대상").attr("disabled", false); 예제입니다. 위와같은 input 태그가 있다고 가정하고, $("#id_input").attr("disabled", true); // $("#id_input").attr("disabled", false); // 실행하면 위 예제처럼 보여지게 됩니다. attr("disabled", true)