사용자가 브라우저 뒤로 버튼을 사용할 때 양식 내의 모든 필드를 지우는 방법이 필요합니다. 지금 브라우저는 마지막 값을 모두 기억하고 돌아갈 때 표시합니다.
이것이 필요한 이유에 대한 더 자세한 설명
은 특정 데이터 그룹 내에서 고유하게 만들기 위해 알고리즘을 사용하여 값이 자동 생성되는 비활성화 된 입력 필드가 있습니다. 양식을 제출하고 데이터가 데이터베이스에 입력되면 사용자는 동일한 값을 다시 사용하여 동일한 양식을 제출할 수 없습니다. 따라서 처음에는 입력 필드를 비활성화했습니다. 그러나 사용자가 브라우저 뒤로 버튼을 사용하는 경우 브라우저는 마지막 값을 기억하고 동일한 값이 입력 필드에 유지됩니다. 따라서 사용자는 동일한 값으로 양식을 다시 제출할 수 있습니다.
내가 이해하지 못하는 것은 브라우저 뒤로 버튼을 누를 때 정확히 일어나는 일입니다. 페이지 크기가 브라우저 캐시 제한 내에 있으면 서버에 연결하지 않고 캐시에서 전체 페이지를 검색 한 것 같습니다. 브라우저 뒤로 버튼을 눌렀을 때 브라우저 설정에 관계없이 페이지가 서버에서로드되었는지 어떻게 확인합니까?
답변
답변
JavaScript가없는 또 다른 방법 <form autocomplete="off">은 브라우저가 마지막 값으로 양식을 다시 채우지 못하도록하는 것입니다.
이 질문 도 참조
<input type="text"양식 내부의 단일 > 로만 테스트 했지만 현재 Chrome 및 Firefox에서는 잘 작동하지만 IE10에서는 작동하지 않습니다.
답변
Chrome에서 BFCache (뒤로 / 앞으로 버튼 캐시)와 관련된 전체 양식을 지우는 방법을 찾는 동안이 게시물을 보았습니다.
Sim이 제공 한 것 외에도 사용 사례에서 세부 정보 를 Back Button의 Clear Form 과 결합해야 합니까? .
이 작업을 수행하는 가장 좋은 방법은 양식이 예상대로 작동하도록 허용하고 이벤트를 트리거하는 것입니다.
$(window).bind("pageshow", function() {
var form = $('form');
// let the browser natively reset defaults
form[0].reset();
});
inputJavaScript에서 객체를 생성하기 위해 이벤트를 처리하지 않거나 그 문제에 대해 다른 작업을 수행하지 않으면 완료된 것입니다. 그러나 이벤트를 수신하는 경우 적어도 Chrome에서는 change이벤트를 직접 트리거해야합니다 (또는 사용자 지정 이벤트를 포함하여 처리하려는 이벤트).
form.find(':input').not(':button,:submit,:reset,:hidden').trigger('change');
즉 추가해야합니다 후reset 좋은 작업을 수행 할 수 있습니다.
답변
이전 브라우저와 호환되어야하는 경우 “pageshow” 옵션이 작동하지 않을 수 있습니다. 다음 코드는 나를 위해 일했습니다.
$(window).load(function() {
$('form').get(0).reset(); //clear form data on page load
});
답변
이것이 나를 위해 일한 것입니다.
$(window).bind("pageshow", function() {
$("#id").val('');
$("#another_id").val('');
});
나는 처음 $(document).ready에 내 jquery 섹션 에서 이것을 가지고 있었는데 이것 역시 작동했습니다. 그러나 모든 브라우저가 $(document).ready뒤로 버튼을 눌렀을 때 실행되는 것은 아니라고 들었 으므로 제거했습니다. 이 접근 방식의 장단점을 모르지만 여러 브라우저와 여러 장치에서 테스트했으며이 솔루션에서 문제가 발견되지 않았습니다.
