Maison > interface Web > js tutoriel > Explication détaillée de la fonction .scroll() dans jQuery

Explication détaillée de la fonction .scroll() dans jQuery

黄舟
Libérer: 2017-07-22 14:54:06
original
2414 Les gens l'ont consulté

La fonction

scroll() est utilisée pour lier une fonction de gestionnaire à l'événement scroll de chaque élément correspondant. Cette fonction peut également être utilisée pour déclencher des événements de défilement. De plus, vous pouvez transmettre des données supplémentaires au gestionnaire d'événements.

L'événement scroll est déclenché lorsque la position de la barre de défilement de l'élément change. Cet événement ne s'applique généralement qu'aux objets fenêtre ou autres éléments défilables (des barres de défilement apparaîtront généralement).

De plus, vous pouvez lier plusieurs gestionnaires d'événements en appelant cette fonction plusieurs fois pour le même élément. Lorsque l'événement de défilement est déclenché, jQuery exécutera les fonctions de traitement des événements liés dans l'ordre de liaison.

Pour supprimer un événement lié via scroll(), utilisez la fonction unbind().

Cette fonction appartient à l'objet (instance) jQuery.

Syntaxe

jQueryObject.scroll( [ [ data ,]  handler ] )
Copier après la connexion

Si au moins un paramètre est spécifié, cela signifie lier la fonction de gestionnaire de l'événement scroll ; si aucun paramètre n'est spécifié, cela signifie déclencher l'événement scroll ;

Paramètres

Explication détaillée de la fonction .scroll() dans jQuery

nouvelle prise en charge de jQuery 1.4.3 : scroll() prend en charge les paramètres de données.

Ceci dans le gestionnaire de paramètres pointe vers l'élément DOM actuel. scroll() transmettra également un paramètre au gestionnaire : l'objet Event représentant l'événement en cours.

Si la valeur de retour du gestionnaire de fonction est fausse, cela signifie empêcher le comportement événementiel par défaut de l'élément et empêcher l'événement de bouillonner dans l'arborescence DOM. Par exemple, si la fonction de gestionnaire de l'événement click du lien renvoie false, le comportement de saut d'URL par défaut du lien peut être empêché.

Le gestionnaire d'événements de défilement du formulaire renvoie false, ce qui peut empêcher le comportement de soumission de formulaire par défaut du formulaire.

Valeur de retour

La valeur de retour de la fonction scroll() est de type jQuery et renvoie l'objet jQuery actuel lui-même.

Exemple et description

Veuillez vous référer à l'exemple de code HTML suivant :

<div id="msg" style="height: 3000px;" ></div>
Copier après la connexion

Maintenant, nous lions la fonction de gestionnaire pour l'événement de défilement de l'objet fenêtre (vous peut en lier plusieurs, exécutés séquentiellement selon l'ordre de liaison lorsqu'il est déclenché) :

$(window).scroll( function(event){
    $("#msg").append( $(this).scrollTop() + &#39;<br>&#39; );
} );

// 触发window对象的scroll事件
// $(window).scroll( );
Copier après la connexion

我们还可以为事件处理函数传递一些附加的数据。此外,通过jQuery为事件处理函数传入的参数Event对象,我们可以获取当前事件的相关信息(比如事件类型、触发事件的DOM元素、附加数据等):

var maxScrollTop = 1000;

// 向下滚动到据顶部超过1000px时,回到顶部
$(window).scroll( maxScrollTop, function(event){
    var $me = $(this);
    if( $me.scrollTop() > event.data ){
        $me.scrollTop( 0 );
    }
} );
Copier après la connexion


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!

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