jQuery.holdReady(hold) 사용예에 대한 자세한 설명
- 伊谢尔伦원래의
- 2017-06-16 15:20:072125검색
.ready() 이벤트 실행을 일시 중지하거나 재개합니다.
$.holdReady() 메서드를 사용하면 호출자가 jQuery의 준비 이벤트를 지연시킬 수 있습니다. 이 고급 기능은 일반적으로 jQuery 플러그인과 같은 JavaScript를 로드하고 DOM이 준비되었을 때에도 추가 준비 이벤트가 발생할 수 있도록 하는 동적 스크립트 로더를 사용하여 수행됩니다. 이 메서드는 파일 초기, 이와 같이
jQuery 스크립트 바로 다음에 호출되어야 합니다. 준비된 이벤트 이후에 이 메서드를 호출하면 해당 이벤트가 발생했더라도 아무런 효과가 없습니다.ready 이벤트를 지연하려면 처음으로 $.holdReady(true)를 호출하세요. Ready 이벤트를 실행해야 할 경우 $.holdReady(false)가 호출됩니다. $.holdReady(true) 를 하나씩 호출하여 Ready 이벤트에 여러 개의 보류를 설정할 수 있습니다. 해당 $.holdReady(false)가 모두 게시되고 일반 파일 준비 조건이 충족될 때까지 준비 이벤트가 실행되지 않습니다.
jQuery.holdReady(hold) 반환 값 유형 boolean
jquery.holdReady() 메서드를 사용하면 jQuery의 완료 이벤트를 이 함수로 잠글 수 있습니다.
이 고급 기능의 일반적인 적용 시나리오는 jQuery 플러그인 등과 같은 스크립트의 동적 로딩입니다.
첨부된 스크립트가 로드될 때까지 페이지가 준비되어 있어도 jQuery 완료 이벤트가 트리거되지 않습니다.
이 함수는 태그 등 페이지 앞부분에서 호출해야 jQuery가 다음 줄을 로드합니다.
완료 이벤트가 트리거된 후에 이 함수를 호출하면 아무런 효과가 없습니다.
사용법: 첫 번째 호출 .holdReady(true) [완료 이벤트는 호출 후 잠깁니다]. 완료 이벤트를 실행할 준비가 되면 .holdReady(false)를 호출하세요.
완료 이벤트에 여러 개의 잠금을 추가할 수 있으며 각 잠금은 $.holdReady(false)[unlock] 호출에 해당합니다.
jQuery의 완료 이벤트는 모든 잠금이 해제되고 페이지가 준비되면 시작됩니다.
사실 이는 동적 스크립트에 의존해야 하는 일부 코드에 대한 보안 잠금입니다.
준비 이벤트는 DOM 트리가 성공적으로 구축된 이후가 아니라 필요한 동적 스크립트가 로드된 후에 실행됩니다.
예제 코드:
예제 1:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="" />
<title>php.cn</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
jQuery.holdReady(true);
$(document).ready(function(){
alert("我不会被弹出");
})
</script>
</head>
<body>
</body>
</html>위 코드에서는 jQuery.holdReady(true) 추가로 인해 문서가 로드되더라도 Ready()에 있는 함수가 실행되지 않습니다.
예 2:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="" />
<title>php.cn</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
</head>
<body>
<button id="first">点击测试弹出</button>
<button id="second">解除延迟</button>
<script type="text/javascript">
jQuery.holdReady(true)
$(document).ready(function(){
$("#first").click(function(){
alert("我不会被弹出");
})
})
$("#second").click(function(){
jQuery.holdReady(false);
})
</script>
</body>
</html>지연 해제를 클릭하면 팝업이 뜹니다.
작은 예를 살펴보겠습니다
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="index.js"></script> <title>Insert title here</title></head> <body> <input type="button" id="btn" value="呵呵"> </body> </html>
그러면 js 파일이 2개가 있습니다
가장 먼저 로드할 것은 index.js입니다
$.holdReady(true);//将holdReady改为ture,点击按钮就没有任何效果,改为false就可以是用来里面的js事件$(function(){
$('#btn').click(function(){
alert(123);
});
});다음 두 js 파일은 index.js와hold.js로 작성됩니다
Only index가 jsp.js에 로드되면 index.js에hold.js를 로드할지 결정합니다.
코드는 다음과 같습니다.
//hold.js$(function(){
alert('这是使用holdReady加载出来的');
});
//index.jsjQuery.holdReady(true)
$.getScript("hold.js", function() {
jQuery.holdReady(false);
});hold.js를 로드할 때 콜백 함수를 호출하고 true를 false로 변경하여 Hold를 수행합니다. js 파일을 로드할 수 있습니다
위 내용은 jQuery.holdReady(hold) 사용예에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!