javascript - Comment obtenir l'effet de chargement lorsque vous utilisez window.location.href pour accéder à une page avant que la nouvelle page ne soit complètement chargée?
漂亮男人2017-05-19 10:45:07
0
4
1784
En utilisant window.location.href pour le saut de page, comment obtenir l'effet de chargement avant que la nouvelle page ne soit complètement chargée ?
Si c'était moi, je ferais ceci : 1. Vous pouvez ajouter l'effet de chargement à la page vers laquelle window.location.href accède. 2. S'il n'y a aucun moyen de modifier le contenu de la page de saut window.location.href, j'utiliserai ajax pour demander la page, insérerai le code HTML dans la page actuelle et le chargerai au moment de la demande de la page.
location.href entraînera un rafraîchissement complet de la page, ce qui n'a rien à voir avec la page précédente.
La page est analysée de haut en bas. Si vous mettez le chargement en haut, elle sera naturellement chargée en premier. Cependant, si vous utilisez des images, le téléchargement des images est asynchrone, vous ne pouvez donc toujours pas contrôler l'ordre et. peut clignoter. Et passé.
Si vous devez le voir, vous pouvez utiliser le chargement sans image, puis masquer d'abord les autres contenus, seul le chargement apparaît, puis l'afficher une fois le chargement complètement déclenché et prêt.
Utilisez window.location.href pour terminer le saut de page. C'est instantané, il n'est donc pas fiable de faire un chargement sur le spectre de la page de saut (A). . window.location.href去完成页面的跳转，这是瞬发的，所以在跳转页(A)做loading是不靠谱的。
Ensuite, l'effet loading doit se faire sur la page redirigée (B). Cependant, l'attribut src de la balise img est asynchrone s'il n'est pas contrôlé par js, alors vous ne pouvez pas garantir que img. temps de chargement, à ce moment vous pouvez essayer d'utiliser l'effet loading de css écrit directement dans le fichier modèle, et désactiver après la page est chargé. L'effet loading de css. #🎜🎜#
Avez-vous des exigences de compatibilité pour cela ? Vous pouvez également ajouter une couche de chargement au saut et le contrôler avec js J'ai écrit un exemple : https://www.mnzld.net/demo/lo...
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Si c'était moi, je ferais ceci :
1. Vous pouvez ajouter l'effet de chargement à la page vers laquelle window.location.href accède.
2. S'il n'y a aucun moyen de modifier le contenu de la page de saut window.location.href, j'utiliserai ajax pour demander la page, insérerai le code HTML dans la page actuelle et le chargerai au moment de la demande de la page.
Le saut
location.href entraînera un rafraîchissement complet de la page, ce qui n'a rien à voir avec la page précédente.
La page est analysée de haut en bas. Si vous mettez le chargement en haut, elle sera naturellement chargée en premier. Cependant, si vous utilisez des images, le téléchargement des images est asynchrone, vous ne pouvez donc toujours pas contrôler l'ordre et. peut clignoter. Et passé.
Si vous devez le voir, vous pouvez utiliser le chargement sans image, puis masquer d'abord les autres contenus, seul le chargement apparaît, puis l'afficher une fois le chargement complètement déclenché et prêt.
Utilisez
window.location.hrefpour terminer le saut de page. C'est instantané, il n'est donc pas fiable de faire unchargementsur le spectre de la page de saut (A). .window.location.href去完成页面的跳转，这是瞬发的，所以在跳转页(A)做loading是不靠谱的。那么
Ensuite, l'effetloading效果是应该放到被跳转页(B)来做。但是img标签src属性是异步的，如果不是用js去控制的话，那么这时你也无法保证img加载的时间，这个时候可以试着用直接写进模板文件当中的css的loading效果来做，等页面加载完了之后关掉css的loadingloadingdoit se faire sur la page redirigée (B). Cependant, l'attributsrcde la baliseimgest asynchrone s'il n'est pas contrôlé parjs, alors vous ne pouvez pas garantir queimg.temps de chargement, à ce moment vous pouvez essayer d'utiliser l'effetloadingdecssécrit directement dans le fichier modèle, et désactiveraprès la page est chargé. L'effet. #🎜🎜#loadingde cssAvez-vous des exigences de compatibilité pour cela ? Vous pouvez également ajouter une couche de chargement au saut et le contrôler avec js
J'ai écrit un exemple :
https://www.mnzld.net/demo/lo...