2009-12-27 3 views
4

OK Je commence juste avec jQuery.Jquery Remplacer par la valeur de retour de la fonction Javascript

J'ai une page avec une table de dates-valeurs. Chacun est enveloppé dans un tag que je peux trouver avec $ ('mytag'). <mytag>2009-10-31</mytag>

Comment, en utilisant Jquery, aurais-je

  1. prendre chacune des valeurs de source et
  2. passe à une fonction Javascript
  3. remplace alors que la valeur de la source au sein de la table avec le résultat de le calcul de la fonction.

Ainsi <mytag>2009-10-31</mytag> serait remplacé par <mytag>Very Late</mytag>

J'ai la fonction Javascript écrit. Ma question est la syntaxe de jQuery pour passer la valeur individuelle.

+1

Bien pensé question, bienvenue dans la communauté. – gnarf

Répondre

6

Tout d'abord, vous aurez besoin d'un sélecteur d'élément, par exemple

$('table') 

sélectionnera tous <tableau> éléments dans votre code HTML. Ainsi,

$('mytag') 

vous donnera vos éléments. Vous obtiendrez un objet jQuery (pas un objet DOM) renvoyé. Voir http://docs.jquery.com/Selectors

Ensuite, vous voulez appeler une fonction pour chacun de vos éléments. Pour cela, nous appelons la fonction .each, et passer la fonction à appeler pour chaque élément:

$('mytag').each(function(){ 
    //function code goes here 
}); 

(Voir http://docs.jquery.com/Utilities/jQuery.each)

La fonction dans ce cas est appelée une fonction anonyme

Ensuite, vous souhaitez référencer l'objet actuel dans l'itération, nous utilisons donc l'élément DOM this et l'enveloppons dans un objet jquery. Pour obtenir la valeur, nous utilisons la fonction (http://docs.jquery.com/Attributes/text)

$('mytag').each(function(){ 
    $(this).text() 
}); 

.text() Note: si elle était un élément d'entrée, alors vous auriez utilisé.val()

passage à une fonction est facile:

... 
    MyFunction($(this).text()); 
    ... 

La fonction text() a une mise en œuvre surchargée qui vous permet de définir le texte si vous passez une valeur:

$(this).text(someval); 

Ainsi, nous pouvons tenir compte dans notre code

... 
    $(this).text(MyFunction($(this).text())); 
    ... 

Faire de notre bloc de code final:

$('mytag').each(function(){ 
    $(this).text(MyFunction($(this).text())); 
}); 
+0

Merci, cela a fonctionné comme un charme, et votre explication était complète et claire. –

0
$('mytag').each(function (index,tag) { 
    $(tag).text(myFunc($(tag).text())); 
}); 
0
$("mytag").each(function() { 
    $(this).html("Very Late"); 

}); 
0
$('mytag').each(function() { 
    $(this).text(someFunction($(this).text())); 
}); 

Mais, à partir du son de votre problème, vous pourriez être mieux servis par le jQuery-timeago plugin. Pour votre cas particulier, vous voudriez peut-être pour permettre des dates futures:

jQuery.timeago.settings.allowFuture = true; 

... et que vous voulez créer votre propre override langue. Voir le language override examples. Vous pouvez définir plusieurs valeurs "en retard" et "très en retard". Vous pouvez également passer une fonction à chacun pour changer la valeur en fonction du nombre d'heures passées.