2010-05-12 7 views
0

Je viens de découvrir des événements en direct dans jQuery.Quel est le problème avec ce morceau de code jQuery?

Je l'essaie. Je l'ai écrit un petit extrait pour lier la souris planant au-dessus des boutons présenter sous une forme:

jQuery("form img.submit_btn").live('hover', function(){ 
    (
     function() { 
     jQuery(this).css('cursor','pointer'); 
     }, 
     function() { 
     jQuery(this).css('cursor','auto'); 
     } 
    ); 
}); 

Cependant, il n'a pas d'effet. Ai-je manqué quelque chose?

[Modifier]

Il vient d'être porté à mon attention que ce comportement peut être trivialement implemeted en utilisant CSS. Peut-être alors, l'exemple que j'ai donné ci-dessus est trop simple. Cependant, la question sous-jacente est toujours comment utiliser l'appel 'live' pour lier les événements hover (donc je peux faire quelque chose de plus compliqué -eg animation etc, qui ne peut pas être fait en utilisant CSS seul)

Répondre

1

Je crois .live() est plus comme .bind() qu'il est comme les méthodes d'événement. Donc, le problème ici est double. Tout d'abord, ce qui précède semble s'attendre à ce que la fonction passée en tant que gestionnaire d'événements retourne les deux fonctions que vous avez listées à la suite de la fonction, mais cela ne fonctionnera pas. Vous avez besoin d'un mot-clé de retour pour cela. Plus important encore, si vous passez hover à live, vous devez essentiellement faire un gestionnaire d'événement de forking. Dans l'exemple jQuery:

$('.hoverme').live('mouseover mouseout', function(event) { 
    if (event.type == 'mouseover') { 
    // do something on mouseover 
    } else { 
    // do something on mouseout 
    } 
}); 

jQuery 1.4.1 marques carte de la hover 'à 'mouseenter mouseleave', vous feriez:

$('.hoverme').live('hover', function(event) { 
    if (event.type == 'mouseenter') { 
    $(this).css('cursor','pointer'); 
    } else { 
    $(this).css('cursor','auto'); 
    } 
}); 

C'est quelque chose de plus compliqué, cependant. Je suis d'accord avec Lazarus que CSS est le moyen d'aller juste pour changer le pointeur; Je suppose que tu voulais faire quelque chose de plus intéressant et c'était juste une expérience.

0

Vous pourriez le faire avec:

$('form img.submit_btn').mouseover(function() { 
    jQuery(this).css('cursor','pointer'); 
}); 
$('form img.submit_btn').mouseout(function() { 
    jQuery(this).css('cursor','auto'); 
}); 

OU

$('form img.submit_btn').mouseover(function() { 
    jQuery(this).css('cursor','pointer'); 
    }).mouseout(function(){ 
    jQuery(this).css('cursor','auto'); 
}); 

Bonne chance

1

Cela semble un peu redondant, il suffit d'utiliser les CSS pour définir l'état de vol stationnaire d'utiliser un curseur de pointeur plutôt que main.

form img.submit_btn:hover { 
    cursor: default; 
} 
+0

Vous pouvez même laisser la partie ': hover' en dehors, car le curseur n'est changé que lorsqu'il est sur l'élément. – RoToRa

+0

Pour être juste, il a dit que "je viens de découvrir des événements en direct dans jQuery". Alors il joue et apprend! Aucun problème avec cela!! –

+0

@neurofluxation Bon point, mais à mon humble part de l'apprentissage JS/jQuery est d'apprendre à savoir quand ** pas ** pour l'utiliser. – RoToRa