질문 : jQuery에게 무언가를 실행하기 전에 모든 이미지가 로드 될 때까지 기다리도록 요청하는 공식적인 방법
이렇게하면 jQuery에서 :
$(function() {
alert("DOM is loaded, but images not necessarily all loaded");
});DOM이로드 될 때까지 기다렸다가 코드를 실행합니다. 모든 이미지가로드되지 않은 경우에도 코드를 실행합니다. 이것은 요소 표시 또는 숨기기 또는 이벤트 첨부와 같은 DOM 항목을 초기화하는 경우 분명히 원하는 것입니다.
일부 애니메이션을 원하고 모든 이미지가로드 될 때까지 실행되는 것을 원하지 않는다고 가정 해 보겠습니다. jQuery에 공식적인 방법이 있습니까?
내가 가진 가장 좋은 방법은 <body onload="finished()"> .하지만 꼭 필요한 경우가 아니면 그렇게하고 싶지 않습니다.
참고 : Internet Explorer의 jQuery 1.3.1 $function() { } 내부에서 코드를 실행하기 전에 모든 이미지가로드되기를 기다리는 버그가 있습니다. 따라서 해당 플랫폼을 사용하는 경우 위에서 설명한 올바른 동작 대신 내가 찾고있는 동작을 얻을 수 있습니다.
답변
jQuery를 사용하면 $(document).ready() 를 사용하여 DOM이로 드 될 때 무언가를 실행 $(window).on("load", handler) 를 사용하여 다음과 같은 다른 모든 항목도로드 될 때 무언가를 실행합니다. 이미지.
jollyrogerNN JPEG 파일 (또는 기타 적절한 파일)이 많은 경우 다음과 같은 완전한 HTML 파일에서 차이점을 확인할 수 있습니다.
<html>
<head>
<script src="jquery-1.7.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert ("done");
});
</script>
</head><body>
Hello
<img src="jollyroger00.jpg">
<img src="jollyroger01.jpg">
// : 100 copies of this in total
<img src="jollyroger99.jpg">
</body>
</html>이를 통해 DOM이 해당 지점에서 준비되었으므로 이미지가로드되기 전에 경고 상자가 나타납니다. 그런 다음 변경하는 경우 :
$(document).ready(function() {으로:
$(window).on("load", function() {다음 경고 상자는 이미지를로드 할 때까지 나타나지 않습니다.
따라서 전체 페이지가 준비 될 때까지 기다리려면 다음과 같이 사용할 수 있습니다.
$(window).on("load", function() {
// weave your magic here.
});출처 : https://stackoverflow.com/questions/544993/official-way-to-ask-jquery-wait-for-all-images-to-load-before-executing-somethin
'프로그래밍 언어 > jQuery, ajax' 카테고리의 다른 글
| jQuery로 데이터 속성으로 요소 선택하는 방법 (0) | 2021.10.06 |
|---|---|
| jQuery를 사용하여 키보드에서 Enter 키를 감지하는 방법 (0) | 2021.10.05 |
| jQuery로 쿠키를 set / unset 하는 방법 (0) | 2021.10.05 |
| jQuery 체크박스가 선택된걸 판단하는 방법 (0) | 2021.10.05 |
| JQuery .each () 거꾸로 나열하는 방법 (0) | 2021.09.30 |