JQuery добавляет строку таблицы после строки, которая вызывает jquery

У меня есть table.

<table id="servers" ...>
...
{section name=i loop=$ownsites}
<tr id="site_id_{$ownsites[i].id}">
...
<td>{$ownsites[i].phone}</td>
<td class="icon"><a id="{$ownsites[i].id}" onClick="return makedeleterow(this.getAttribute('id'));" ...></a></td>
</tr>       
{/section}
<tbody>
</table>

И этот JavaScript.

<script type="text/javascript">
function makedeleterow(id)
    {
        $('#delete').remove();
        $('#servers').append($(document.createElement("tr")).attr({id: "delete"}));
        $('#delete').append($(document.createElement("td")).attr({colspan: "9", id: "deleter"}));
        $('#deleter').text('Biztosan törölni szeretnéd ezt a weblapod?');
        $('#deleter').append($(document.createElement("input")).attr({type: "submit", id: id, onClick: "return truedeleterow(this.getAttribute('id'))"}));
        $('#deleter').append($(document.createElement("input")).attr({type: "hidden", name: "website_del", value: id}));
    }
</script>

Он работает отлично, после table last tr он делает tr и помещает в него информацию, а функция удаления также отлично работает.

Но я хотел бы сделать это append ПОСЛЕ tr (с td class="icon"), который вызывает script. Как я могу это сделать?

Ответ 1

Вы можете использовать функцию .after() в jQuery для добавления некоторого содержимого после другого элемента.

Итак, вместо

$("servers").append( ... );

вы бы использовали

$("#" + id + ).closest( "tr" ).after( ... );

или вы также можете использовать

$( ... ).insertAfter( $("#" + id ).closest( "tr" ) );

что существенно эквивалентно.

Подробнее см. http://api.jquery.com/after/.

Ответ 2

попробуйте .prepend() вместо .append()

Ответ 3

interst tr id, затем onclick = "xyz()"

что-то вроде этого:

<tr id=""  onclick="xyz()"><td></td><td></td></tr>
<script>
    function xyz()
    {
    var newrow = "<tr><td>data1</td><td>data1</td></tr>";        
    $("#tr_id").after(newrow);
    }
</script>