数据表Jquery通过单击TR展开/折叠

我正在使用jquery datatables插件，我想通过单击TR扩展我的表。

他们的网站上有一个示例，通过单击列中的图像进行扩展和折叠：

http://datatables.net/release-datatables/examples/api/row_details.html

请有人帮我修改下面的代码，以便我可以通过单击TR展开/折叠该行

/* Formating function for row details */ function fnFormatDetails ( oTable, nTr ) { var aData = oTable.fnGetData( nTr ); var sOut = ''; sOut += ''; sOut += ''; sOut += ''; sOut += '
Rendering engine:
'+aData[1]+' '+aData[4]+'
Link to source:
Could provide a link here
Extra info:
And any further details here (images etc)
'; return sOut; } $(document).ready(function() { /* * Insert a 'details' column to the table */ var nCloneTh = document.createElement( 'th' ); var nCloneTd = document.createElement( 'td' ); nCloneTd.innerHTML = ''; nCloneTd.className = "center"; $('#example thead tr').each( function () { this.insertBefore( nCloneTh, this.childNodes[0] ); } ); $('#example tbody tr').each( function () { this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] ); } ); /* * Initialse DataTables, with no sorting on the 'details' column */ var oTable = $('#example').dataTable( { "aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0 ] } ], "aaSorting": [[1, 'asc']] }); /* Add event listener for opening and closing details * Note that the indicator for showing which row is open is not controlled by DataTables, * rather it is done here */ $('#example tbody td img').live('click', function () { var nTr = this.parentNode.parentNode; if ( this.src.match('details_close') ) { /* This row is already open - close it */ this.src = "http://sofzh.miximages.com/jquery/datatables-jquery-expand-collapse-by-clicking-tr"; oTable.fnClose( nTr ); } else { /* Open this row */ this.src = "../examples_support/details_close.png"; oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' ); } } ); } ); 

提前致谢。

Answer 1

将此代码放在那里，然后编写一个函数来执行展开/折叠事件。

 $('#example tbody tr').click( function () { $('#example tbody tr').myExpandCollapseFunction(); } 

将代码放在此代码之后……

  $('#example thead tr').each( function () { this.insertBefore( nCloneTh, this.childNodes[0] ); } ); $('#example tbody tr').each( function () { this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] ); } );