Maison > interface Web > js tutoriel > le corps du texte

méthode jquery pour obtenir le contenu du fichier via le chargement et passer au point d'ancrage_jquery

WBOY
Libérer: 2016-05-16 16:17:07
original
1197 Les gens l'ont consulté

L'exemple de cet article décrit comment jquery obtient le contenu du fichier via le chargement et passe au point d'ancrage. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Hier, je faisais une page semblable à un document d'aide, avec la navigation à gauche et le contenu à droite. À l'origine, j'avais prévu d'utiliser une iframe pour implémenter la zone d'affichage du contenu sur la droite, mais comme je devais ajuster la hauteur de l'iframe, j'ai changé la méthode et utilisé la méthode de chargement dans l'ajax de jquery.

Récupérer le contenu d'un fichier distant est facile à mettre en œuvre, il suffit d'utiliser la méthode de chargement de jquery :

$("#content").load("xxx.aspx")
Copier après la connexion

Cela facilite le placement du contenu du fichier xxx.aspx dans la balise avec l'identifiant du contenu. Un autre effet qui doit être obtenu maintenant est le suivant : après avoir obtenu le contenu du fichier, je dois accéder au point d'ancrage correspondant, j'ai donc pensé à utiliser scrollTop de jquery. Par exemple, après avoir obtenu le contenu du fichier, je. besoin de se déplacer vers la balise avec id="name" :

$("body,html").animate({scrollTop:$("#name").offset().top});
Copier après la connexion

offset() consiste à obtenir le décalage relatif de l'élément correspondant dans la fenêtre actuelle. $("#name").offset().top consiste à obtenir le décalage relatif de l'étiquette avec le nom d'ID à partir du haut de la fenêtre actuelle. Le code ci-dessus combiné en un seul morceau doit être écrit comme ceci :

$(function(){
 $("#content").load("xxx.aspx",function(){
  $("body,html").animate({scrollTop:$("#name").offset().top});
 });
})
Copier après la connexion

Afin d'éviter de cliquer sur la navigation pour envoyer en continu des requêtes au serveur, nous pouvons stocker les données obtenues à chaque fois.

Bien sûr, cette méthode ne convient qu'aux pages qui ne prennent pas en compte l'optimisation SEO.

J'espère que cet article sera utile à la programmation jQuery de chacun.

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal