jQuery break out of table

Question

У меня есть стандартная таблица в формате HTML, которая динамически генерирует контент через Zend Framework. Из чего у меня проблема, изменяющая форму внутри PHP-стороны. Поэтому мне нужно каким-то образом изменить внешний вид таблиц. С этим случаем у меня есть элемент, который появляется в одной из строк, и когда этот элемент появляется, я хочу вырваться из таблицы, а затем сделать что-то после этого, а затем снова запустить таблицу.

В основном я хочу, чтобы впрыснуть equivlant из

</tbody></table>/*other stuff*/<table><tbody> после строки, содержащей один элемент, я ищу, который в данном случае представляет собой метку.

Я пробовал $("label[for='theLable']").parents('tr').after('</tbody></table><br><table><tbody>'), который, как представляется, игнорирует конечные детали таблицы, добавляет команду br, а затем делает полный тег open/close для таблицы и tbody внутри той же таблицы. Я пытаюсь вырваться из так называемых tr тегов, в основном это добавляет эта новая таблица

Каким образом можно подойти к этой концепции?

обновление с jsfiddle ссылка

http://jsfiddle.net/cPWDh/

Answer 1

Вы не можете изменить HTML документа так, как вы думаете, так как это не является законным способом изменить DOM.

Вместо этого я хотел бы создать новую таблицу и .append строки, которые вы хотите, чтобы перейти к нему, который будет автоматически перемещать их из текущего местоположения (вместо их копирования):

$(document).ready(function() { 
    var $trow = $('label[for="specialLabel"]').closest('tr'), 
     $table = $trow.closest('table'); 
    $('<table>').append($trow.nextAll().andSelf()).insertAfter($table); 
});​ 

http://jsfiddle.net/cPWDh/1/

Answer 2

Этот подход не будет работать в js. Что бы вы могли сделать, если в таблице не так много строк:

var nextTable = $("table").after("/*other stuff*/<table id="nextTable"></table>"); 
//now you loop over the lines of your original table that you want to have after the "break", and move them to the nextTable: 

var before = true; 
$("table tr").each(function(){ 
    if ($(this).has("[for='theLable']")) { 
     before = false; 
    } 
    if (!before) { 
     nextTable.append($(this)); 
    } 
});