Mise à jour Javascript vers la cellule de tableau HTML (de milliers à millions)

Question

J'ai besoin de créer du Javascript sur mon rapport Web qui convertit les valeurs de table en milliers ou en millions (par exemple divise ou multiplie par 1000). Le problème est que chaque valeur est "cliquable" (c'est-à-dire qu'elle est enveloppée dans une étiquette d'ancrage).

Est-ce possible?

<table class="Table" > 
<thead><tr> 
    <th class="l Header" scope="col">£000s</th> 
    <th class="l Header" scope="col">Col1</th> 
    <th class="l Header" scope="col">Col2</th> 
</tr></thead> 
<tbody> 
<tr> 
    <td class="l Data"> My Data Row </td> 
    <td class="l Data"> <a class=nums href="javascript:MyFunc();"> 11,372,397</a></td> 
    <td class="l Data"> <a class=nums href="javascript:MyFunc();"> 11,344,327</a></td> 
</tr> 
</tbody> 

modifier

J'utilise IE6. Fondamentalement, le but est d'avoir un bouton 'milliers' et un bouton 'millions' pour que les valeurs de la table deviennent 11,372k ou 11,4m etc ...

Answer 1

J'utiliseraient jQuery

$(function(){ 
    $.each($('.nums'), function() { 
     $(this).html(Number($(this).html().replace(/,/g,"")) /*your math here*/); 
    }); 
}); 

En réponse à votre édition: Depuis que je suis ennuyé que j'ai écrit ce morceau de code de travail pour vous, rond et insérez ',' comme bon vous semble.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 

<table class="Table" > 
<thead><tr> 
    <th class="l Header" scope="col">£000s</th> 
    <th class="l Header" scope="col">Col1</th> 
    <th class="l Header" scope="col">Col2</th> 
</tr></thead> 
<tbody> 
<tr> 
    <td class="l Data"> My Data Row </td> 
    <td class="l Data"> <a class="nums" href="javascript:MyFunc();"> 11,372,397</a></td> 
    <td class="l Data"> <a class="nums" href="javascript:MyFunc();"> 11,344,327</a></td> 
</tr> 
</tbody> 

<input type="button" onclick="toMillions();"> 
<input type="button" onclick="restore();"> 

<script type="text/javascript"> 

    $(function(){ 
     $.each($('.nums'), function() { 
      $.data(this, "theValue", $(this).html()); 
     }); 
    }); 


    function toMillions(){ 
     $.each($('.nums'), function() { 
      $(this).html(Number($.data(this,"theValue").replace(/,/g,""))/1000000 + ' million'); 
     }); 
    } 

    function restore(){ 
     $.each($('.nums'), function() { 
       $(this).html($.data(this,"theValue")); 
     }); 
    } 
</script> 

Answer 2

Je commencerais à penser à document.getElementsByClassName ('nums'), qui vous donnera un tableau de vos éléments. Quelque chose comme ceci:

nums = document.getElementsByClassName('nums'); 
for (i in nums) 
    nums[i].innerHTML = nums[i]+',000';i 

Cela fonctionne probablement que dans les navigateurs plus récents, cependant, de sorte que vous pouvez utiliser une méthode similaire dans un framework javascript. Jquery permet d'obtenir les éléments de classname avec le sélecteur

$('.nums')