input, form 태그에 브라우저의 자동완성 기능 해제하는 방법

브라우저에서 input창에 이전에 입력했던 내용에 대해 자동 완성을 제공합니다. 이것을 브라우저에서 해제하는 방법이 있지만, 고객에게 일일이 다 해제하라고 할 수 없습니다.

 

이때, 약간의 코드 수정으로 이를 해결할 수 있습니다.

<input
  autocomplete="off"
  maxlength="30"
  name="email"
  type="text"
  class="input email"
  placeholder="E-MAIL"
  id="email" />

<input
  autocomplete="off"
  name="pwd"
  type="password"
  class="input password"
  placeholder="PASSWORD"
  id="pwd" />
  
<textarea
  autocomplete="off"
  class="texts"
  id="contents"
  name="contents"></textarea>

 

이와 같이 html tag의 autocomplete 옵션을 off로 하여 해결할 수 있습니다.

위 예제는 개별로 일일이 지정하는 방법이라 귀찮습니다.

 

다음과 같이 form tag 지정하여 한번에 해결할 수 있습니다.

<form autocomplete="off">
  <input ... />
  <input ... />
  <textarea ... />
</form>

 

 

 

단, 이 방법은 google chrome 브라우저에서는 동작하지 않습니다. 그 이유는 구글은 autocomplete 속성을 조작하는 행위가 모든 사용자에게 제공하는 것은 좋지 않다고 판단하기 때문입니다.