모든 브라우저에서 뒤로 버튼을 사용한 후 'onload' 이벤트를 안정적으로 트리거하려면 어떻게 해야 합니까?-JS 튜토리얼-php.cn

모든 브라우저에서 뒤로 버튼을 사용한 후 'onload' 이벤트를 안정적으로 트리거하려면 어떻게 해야 합니까?

Patricia Arquette

풀어 주다： 2024-12-17 04:45:25

원래의

222명이 탐색했습니다.

How Can I Reliably Trigger the `onload` Event After Using the Back Button in All Browsers?

뒤로 버튼 클릭 시 브라우저 간 온로드 이벤트 문제 해결

웹 개발 세계에서는 브라우저별 동작을 처리하는 것이 중요합니다. 이러한 문제 중 하나는 IE를 제외하고 뒤로 버튼을 통해 페이지로 돌아갈 때 트리거되지 않는 JavaScript onload 이벤트에서 발생합니다. 이 글은 이 문제를 해결하기 위한 크로스 브라우저 솔루션을 탐구하는 것을 목표로 합니다.

문제 설명

위에서 언급했듯이 주요 브라우저(Firefox, Opera, Safari)에는 페이지로 다시 탐색할 때 onload 이벤트 지원. 이는 페이지 로드 시 필요한 스크립트나 애니메이션을 실행하는 데 방해가 됩니다.

해결책

다행히도 jQuery는 페이지를 다시 로드할 때 페이지를 다시 로드하는 다양한 솔루션을 제공합니다. 버튼이 눌려졌습니다. 흥미롭게도 이 동작은 jQuery에 onunload 이벤트 리스너가 포함되어 있기 때문에 발생합니다.

기능

body 태그에 onunload를 추가하면 JQuery 접근 방식과 유사하게 작동하는 onload 이벤트가 시작됩니다. . 이 기술은 이벤트 핸들러의 내용에 관계없이 Safari, Opera 및 Mozilla에서 페이지 다시 로드를 효과적으로 트리거합니다.

예

<body onunload="">
    <script>
        alert('first load / reload');
        window.onload = function() { alert('onload') };
    </script>
    <a href="http://stackoverflow.com">click me, then press the back button</a>
</body>

로그인 후 복사

이 예에서는 초기 페이지 로드 후 뒤로 버튼을 클릭하면 경고 메시지가 생성됩니다.

추가 참고