5

各セル情報をツールチップに表示するようにコードを変更するにはどうすればよいですか??

http://datatables.net/release-datatables/examples/advanced_init/events_post_init.html

$(document).ready(function() {
/*
* First step is to create title attributes for the rows in the table
* This isn't needed if the required 'title' attribute is already set in the HTML in the
* DOM
*/
$('#example tbody tr').each( function() {
var sTitle;
var nTds = $('td', this);
var sBrowser = $(nTds[1]).text();
var sGrade = $(nTds[4]).text();

if ( sGrade == "A" )
sTitle = sBrowser+' will provide a first class (A) level of CSS support.';
else if ( sGrade == "C" )
sTitle = sBrowser+' will provide a core (C) level of CSS support.';
else if ( sGrade == "X" )
sTitle = sBrowser+' does not provide CSS support or has a broken implementation. Block CSS.';
else
sTitle = sBrowser+' will provide an undefined level of CSS support.';

this.setAttribute( 'title', sTitle );
} );

/* Init DataTables */
var oTable = $('#example').dataTable();

/* Apply the tooltips */
oTable.$('tr').tooltip( {
"delay": 0,
"track": true,
"fade": 250
} );
} );
4

2 に答える 2

9

できるよ

{ "sTitle": "...", ...
   'fnCreatedCell': function(nTd, sData, oData, iRow, iCol) {
        nTd.title = 'Some more information';
   }
}

列構成で。このようにすべての行データを簡単に使用できます。当然のことながら、これが欠落していてはなりません:

oTable.$('td').tooltip( {
    "delay": 0,
    "track": true,
    "fade": 100
} );
于 2012-11-28T18:12:33.603 に答える
2

各 td の setAttribute だけでタイトルを設定できます

 $('#example tbody tr td').each( function() {
    this.setAttribute( 'title', $(this).text());
});

そしてtdでツールチップを呼び出します

oTable.$('td').tooltip( {
"delay": 0,
"track": true,
"fade": 250
} );
于 2012-07-03T11:37:16.043 に答える