Problèmes de base de jQuery

Question

Je me bats avec jQuery depuis longtemps maintenant. C'est très puissant et il y a beaucoup de choses que nous pouvons faire avec jQuery.

Mon problème est que j'utilise beaucoup de fonctionnalités jQuery en même temps. Par exemple. J'ai un site qui affiche des éléments, 12 éléments par page et je peux paginer à travers les pages en utilisant jquery. Sur la même page j'ai implémenté un bouton thumpsUp qui utilise aussi jQuery.

Plus j'utilise de fonctions jQuery, plus il est difficile de les organiser correctement. E.g .:

$(document).ready(function() { 
$(".cornerize").corner("5px"); //cornerize links 
$('a#verd').live('click', exSite); //open iframe 
$("a.tp").live('click', thumpsUp); //thumps up 
$("a#next").click(getProgramms); //next page 
$("a#previous").click(getProgramms); //previous page 
    //for the current page reload the content 
$("a#page").each(function() { 
    $(this).click(getProgramms); 
}); 
//this isn't working... 
$('.smallerpost').live('click', alert('test')); 
}); 

Jetez un oeil à la dernière ligne de code. Je veux effectuer une alerte lorsque l'élément div est cliqué. Au lieu de le faire, la page me montre l'alerte lorsque je rafraîchis la page. Un clic sur la div n'a aucun effet.

Qu'est-ce que je fais mal? Quelle serait la stratégie ici pour avoir une jQuery propre et efficace?

Answer 1

Modifier cette ligne pour

$('.smallerpost').live('click', function() { 
    alert('test'); 
}); 

et pendant que vous êtes là ...

$("a#page").each(function() { 
    $(this).click(getProgramms); 
}); 

a exactement le même effet que:

$('a#page').click(getProgramms); 

... mais techniquement il devrait y avoir un seul élément avec id = 'page' de toute façon

Answer 2

Votre code $('.smallerpost').live('click', alert('test')); appelle immédiatement le alert et transmet sa valeur de retour dans la fonction live en tant que second paramètre. Qu'est-ce que vous voulez passer il y a une fonction à appeler, si vous voulez:

$('.smallerpost').live('click', function() { 
    alert('test'); 
}); 

ou

$('.smallerpost').live('click', handleSmallerPostClick); 

function handleSmallerPostClick() { 
    alert('test'); 
} 

... selon la façon dont vous structurez votre code.