Explication détaillée des exemples d'utilisation de jQuery.holdReady(hold)-js tutoriel-php.cn

Explication détaillée des exemples d'utilisation de jQuery.holdReady(hold)

伊谢尔伦

Libérer： 2017-06-16 15:20:07

original

2115 Les gens l'ont consulté

Suspendre ou reprendre l'exécution de l'événement .ready().

La méthode $.holdReady() permet à l'appelant de retarder l'événement ready de jQuery. Cette fonctionnalité avancée est généralement réalisée à l'aide d'un chargeur de script dynamique, qui charge du JavaScript tel qu'un plug-in jQuery et permet à des événements prêts supplémentaires de se produire même lorsque le DOM est prêt. Cette méthode doit être appelée au début du fichier, immédiatement après le script jQuery

comme celui-ci. L'appel de cette méthode après l'événement ready n'aura aucun effet même s'il a été émis.

Pour retarder l'événement ready, appelez $.holdReady(true) pour la première fois. Lorsque l'événement ready doit être exécuté, $.holdReady(false) est appelé. Veuillez noter que plusieurs mises en attente peuvent être placées sur l'événement ready, chacune appelant $.holdReady(true) une par une. L'événement ready ne s'exécutera pas tant que tous les $.holdReady(false) correspondants n'auront pas été publiés et que les conditions normales de préparation du fichier ne seront pas remplies.

jQuery.holdReady(hold) Type de valeur de retour booléen

La méthode jquery.holdReady() permet à l'événement d'achèvement de jQuery d'être verrouillé par cette fonction.
Une application typique de cette fonctionnalité avancée est le chargement dynamique de scripts, tels que les plug-ins jQuery, etc.
L'événement d'achèvement jQuery ne sera pas déclenché tant que le script ci-joint n'est pas chargé, même si la page est prête.
Cette fonction doit être appelée dans la partie avant de la page, comme dans la balise, jQuery charge la ligne suivante.
L'appel de cette fonction après le déclenchement de l'événement d'achèvement n'a aucun effet.
Utilisation : premier appel à .holdReady(true) [l'événement d'achèvement sera verrouillé après l'appel]. Lorsque vous êtes prêt à déclencher l'événement d'achèvement, appelez .holdReady(false). Il convient de noter que
peut ajouter plusieurs verrous à l'événement d'achèvement, et chaque verrou correspond à un appel $.holdReady(false)[unlock].
L'événement d'achèvement de jQuery sera déclenché lorsque tous les verrous auront été libérés et que la page sera prête.
En fait, il s'agit d'un verrou de sécurité pour certains codes qui doivent s'appuyer sur des scripts dynamiques.
L'événement ready sera exécuté après le chargement des scripts dynamiques requis, plutôt qu'après la construction réussie de l'arborescence DOM.

Exemple de code :

Exemple 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>

Copier après la connexion

Dans le code ci-dessus, en raison de l'ajout de jQuery.holdReady(true), même si le document est chargé , ce ne sera pas le cas. La fonction dans ready() sera exécutée.

Exemple 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>

Copier après la connexion

Lorsque vous cliquez pour libérer le délai, il apparaîtra.

Regardons à nouveau un petit exemple

<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>

Copier après la connexion

Ensuite, il y a deux fichiers js

Le premier chargé est index.js

$.holdReady(true);//将holdReady改为ture,点击按钮就没有任何效果,改为false就可以是用来里面的js事件$(function(){
    $(&#39;#btn&#39;).click(function(){
        alert(123);
    });

});

Copier après la connexion

Écrivez ci-dessous Il y a deux fichiers js index.js et hold.js

Seul index.js est chargé en jsp, et il est décidé s'il faut charger hold.js dans index.js
Le code est comme suit :

//hold.js$(function(){
    alert(&#39;这是使用holdReady加载出来的&#39;);
}); 

//index.jsjQuery.holdReady(true)
$.getScript("hold.js", function() {
    jQuery.holdReady(false);
});

Copier après la connexion

Lors du chargement de hold.js, appelez une fonction de rappel et remplacez true par false, afin que le fichier hold.js puisse être chargé

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!