입력 값을 캐시 / 보존하지 않도록 브라우저에 알리는 페이지 만들기

대부분의 브라우저는 양식 입력 값을 캐시합니다. 따라서 사용자가 페이지를 새로 고치면 입력 값이 동일합니다.

여기 내 문제가 있습니다. 사용자가 저장을 클릭 하면 서버는 POST 된 데이터 (예 : 확인 된 제품)의 유효성을 검사하고 유효하지 않은 경우 브라우저로 다시 보냅니다. 그러나 위에서 언급했듯이 서버가 일부 값에 대한 선택을 취소하더라도 브라우저 캐시로 인해 여전히 선택 될 수 있습니다!

내 데이터에는 보이지 않는 (상위 항목이 선택 될 때까지) 확인란이 있으므로 사용자는 저장을 다시 클릭 하고 오류 메시지가 표시 될 때까지 일부 이전 값이 여전히 선택되어 있다는 사실을 알지 못할 수 있습니다 . 짜증나 네요.

이것은 Ctrl+ 를 수행하여 해결할 수 F5있지만 해결책은 아닙니다. 일부 양식 / 페이지에서 양식 입력 데이터를 캐시하지 않도록 브라우저에 알리는 자동 / 프로그래밍 방식이 있습니까?

값을 명시 적으로 공백으로 설정하고 있습니까? 예를 들면 :

<input type="text" name="textfield" value="">

그러면 브라우저가 데이터를 저장해서는 안되는 곳에 데이터를 넣는 것을 막을 수 있습니다. 또는 autocomplete양식 태그에 속성을 추가 할 수 있습니다 .

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

에서 스택 오버플 참조

브라우저가 이미 값을 저장 한 경우 value = ""로 작동하지 않았으므로 추가해야합니다.

입력 태그의 경우 설정할 수있는 자동 완성 속성이 있습니다.

<input type="text" autocomplete="off" />

양식에도 자동 완성을 사용할 수 있습니다.

또 다른 접근 방식은 HTML의 양식 바로 뒤에 JavaScript를 사용하여 양식을 재설정하는 것입니다.

<form id="myForm">
  <input type="text" value="" name="myTextInput" />
</form>

<script type="text/javascript">
  document.getElementById("myForm").reset();
</script>

기본적으로 캐시를 지우는 방법에는 두 가지가 있습니다.

<form autocomplete="off"></form>

또는

$('#Textfiledid').attr('autocomplete', 'off');

이것은 최신 브라우저에서 나를 위해 일했습니다.

autocomplete="new-password"