Changement de html td dans JQuery

Question

Je veux changer le texte dans le tableau td de 1,1,1 à 1,2,3 avec jQuery
Mais cela ne semble pas fonctionner. qu'est-ce qui ne va pas dans mon code?

C'est ma fonction JavaScript.

function reorder(targetId){ 
     var i = 1; 
     jQuery.find(targetId).each(function(){ 
      jQuery(this).attr("innerHTML", i); 
      i ++; 
     }); 
    } 

Mon code html.

<form> 
    <input type="button" onClick="reorder('#index');" value="test"/> 
    <table> 
     <tr><td id="index">1</td></tr> 
     <tr><td id="index">1</td></tr> 
     <tr><td id="index">1</td></tr> 
    </table> 
</form> 

Answer 1

Vous avez un peu de confusion là-bas. Essayez ceci ...

function reorder(selector){ 
    jQuery(selector) 
     .find('tr td:first-child') 
     // Remove the + 1 if you want it to start at 0.   
     .html(function(i) { return i + 1; }); 
} 

Voici quelques-uns des changements ...

• Changé votre variable d'argument pour être plus clair. Vous pouvez utiliser jQuery ('selector'), pas jQuery.find().
• Vous pouvez utiliser la méthode html().

Il convient de mentionner aussi que si vous ne l'utilisez une autre bibliothèque jQuery (ou ne pas l'intention), vous pouvez utiliser $ qui est plus courte que jQuery.

J'ai également modifié votre code HTML

<form> 
    <input type="button" onclick="reorder('#my-table');" value="test"/> 
    <table id="my-table"> 
     <tr><td>1</td></tr> 
     <tr><td>1</td></tr> 
     <tr><td>1</td></tr> 
    </table> 
</form> 

Vous avez peut-être oublié que l'utilisation de plusieurs attributs id avec la même valeur n'est pas le balisage valide. Vous pourriez utiliser une classe là-bas, ou mieux encore l'omettre complètement. Vous pouvez ne pas se soucier de balisage valide, mais les navigateurs CSS et JavaScript pourrait faire des choses funky (maintenant ou dans l'avenir) quand ils s'attendent à un attribut id à unique.

Answer 2

Je pense que vous devez changer l'expression d'incrémentation des valeurs i.

function reorder(targetId){ 
     var i = 1; 
     jQuery.find(targetId).each(function(){ 
      jQuery(this).attr("innerHTML", i); 
      i++; // Before that it was i ++ 
     }); 
    }