본문 바로가기

웹프로그래밍

(3)
같은 element에 등록된 여러 이벤트 리스너 호출을 막는 stopImmediatePropagation() 문제 여태 preventDefault()나 stopPropagation()을 사용할 일은 많았다. 그런데 오늘 모달 팝업 개발 중, 공통에서 처리해둔 닫기버튼 이벤트 전에 confirm을 띄워야 하는 일이 생겼다. 하나의 엘리먼트에 다른 클릭 이벤트 리스너를 추가해서 이벤트 전파를 막아야 하는 것이다. 결론저으로 앞에 언급한 두 가지 모두 아니고, stopImmediatePropagation()을 사용해야 한다. 정리 preventDefault - 기본 동작을 막는다. (예컨대 submit 버튼이라면 form submit을 막음) stopPropagation - 이벤트 버블링을 방지한다. stopImmediatePropagation - 같은 element 동일한 이벤트(예:클릭)에 여러 리스너가 등록되어..
크롬 브라우저 비밀번호 자동완성 방지 (autocomplete 불가 시) 결론부터 크롬에서는 autocomplete 어트리뷰트 대신, 임의의 을 넣어주자. 개요 보통 회원정보에서 내 정보 수정을 할 때는 비밀번호 변경만 따로 있는 경우가 많다. 근데 이번 경우는 같은 폼에 있어서, 비번을 입력하지 않을 경우 수정되지 않는 폼이었다.(비번 재입력 받는 부분도 없음) 어쨌든 별도 입력을 안했는데 비번이 바뀌었다고 해서 확인해보니, 브라우저 자동완성이 문제였다. 사용자 행동 크롬은 사이트에 로그인을 하면 비번을 저장할 것인지 묻는다. 사용자가 여기서 '예'를 선택하여 인증정보를 저장했다. 내 정보 수정 화면에 접속 비밀번호 란에 자동완성 된 비밀번호가 입력되어 있음 '저장'하면 인코딩이 바뀌어 엉뚱한 비번이 들어감 로그인 못함... 해결책 비밀번호 자동완성 방지를 위해 input ..
게시판 내용에서 HTML 태그 제외하고 검색하기 요약: 정규식으로 HTML 태그를 삭제하고 검색한다. 사용자의 눈으로 게시판 글 등록 시 위지윅 HTML 에디터 (summernote, CK Editor, 네이버 스마트에디터 등)를 사용해서 글을 등록하면 (당연하게도)HTML이 함께 저장된다. 에디터에 따라 내용도 함께 저장되는 경우도 있다. 개발자가 보기에는 너무나 당연하지만, 사용자가 보기에는 내용에 안보이는 것이 검색되면 오류라고 생각한다. 예를 들어 line_friends.png를 에디터의 이미지 첨부했다. 저장된 콘텐츠는 다음과 같다. 라인 캐릭터 졸귀탱! friend라는 단어로 검색했다. 사용자가 보기에는 라인 캐릭터 졸귀탱! 밖에 안 보이는데 해당 게시물이 검색된다. 태그 지우고 텍스트 내용만 보기 HTML을 제외하고 게시물을 보기 위해 정..