Изменение HTML-кода в JQuery - PullRequest
Новая
       30

Изменение HTML-кода в JQuery

2 голосов
/ 19 марта 2010

Я хочу изменить текст таблицы td с 1,1,1 до 1,2,3 с помощью jQuery
Но это не похоже на работу. что не так в моем коде?

Это моя функция JavaScript. 

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

Мой 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>

Ответы [ 2 ]

3 голосов
/ 19 марта 2010

У вас там немного перепутано. Попробуйте это ... 

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; });
}

Вот некоторые изменения ...

  • Изменена переменная аргумента, чтобы она была более понятной.
  • Вы можете использовать jQuery («селектор»), а не jQuery.find().
  • Вы можете использовать метод html().

Стоит также упомянуть, что если вы не используете другую библиотеку jQuery (или не собираетесь), вы можете использовать $, который короче jQuery.

Я также изменил ваш 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>

Возможно, вы забыли, что использование нескольких атрибутов id с одним и тем же значением не является допустимой разметкой. Вы можете использовать класс там, или лучше все же опустить его полностью. Вы можете не заботиться о допустимой разметке, но CSS и JavaScript браузеров могут сделать что-то напуганное (сейчас или в будущем), когда они ожидают, что атрибут id уникален.

1 голос
/ 19 марта 2010

Я думаю, вам нужно изменить выражение значения i.

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