下面一段代码是关于datatable增加跳转到指定页功能，具体代码如下所示：

varmytable = $('#datatables'); mytable.dataTable( { "sDom":"<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>", "sPaginationType":"bootstrap", "bProcessing":true, "bServerSide":true, "sAjaxSource":"/user/list", "aoColumns": [ {"mData":"Id"}, {"mData":"Username"}, {"mData":function(obj){ returnobj.group; }}, {"mData":"yiyuan"}, {"mData":function(obj){ returnobj.keshi; }}, {"mData":function(obj){ if(obj.Status==1){ return"使用中"; }else{ return"禁用"; } }}, {"mData":function(obj){ vardel=""; if(isAdmin){ del='<a data-title="' + obj.Id + '" class="btn btn-danger"><i class="icon-wrench icon-white" ></i>删除</a>'; } return'<a data-title="' + obj.Id + '" class="btn btn-success" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" ><i class="icon-edit icon-white"></i>修改</a>'+'&nbsp;&nbsp;'+del; },bSortable : false} ], "fnDrawCallback":function(){ varoTable = $("#datatables").dataTable(); $('#redirect').keyup(function(e){ if($(this).val() && $(this).val()>0){ varredirectpage = $(this).val()-1; }else{ varredirectpage = 0; } oTable.fnPageChange( redirectpage ); }); } });bootstrap插件形式：$.extend(true, $.fn.dataTable.defaults, { "sDom":"<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>", "sPaginationType":"bootstrap", "oLanguage": { "sSearch":"快速搜索:", "bAutoWidth":true, "sLengthMenu":"每页显示 _MENU_ 条记录", "sZeroRecords":"Nothing found - 没有记录", "sInfo":"_START_ 到 _END_ 条,共 _TOTAL_ 条", "sInfoEmpty":"显示0条记录", "sInfoFiltered":"(从 _MAX_ 条中过滤)", "sProcessing":"<div style=''><img src='../static/img/loader.gif'><span>加载中...</span></div>", "oPaginate": { "sPrevious":"", "sNext": "", "sLast": ">>", "sFirst": "<<" } }} );$.extend( $.fn.dataTableExt.oStdClasses, { "sWrapper":"dataTables_wrapper form-inline"} );$.fn.dataTableExt.oApi.fnPagingInfo = function( oSettings ){ return{ "iStart": oSettings._iDisplayStart, "iEnd": oSettings.fnDisplayEnd(), "iLength": oSettings._iDisplayLength, "iTotal": oSettings.fnRecordsTotal(), "iFilteredTotal": oSettings.fnRecordsDisplay(), "iPage": Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ), "iTotalPages": Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength ) };};$.extend( $.fn.dataTableExt.oPagination, { "bootstrap": { "fnInit":function( oSettings, nPaging, fnDraw ) { varoLang = oSettings.oLanguage.oPaginate; varfnClickHandler = function( e ) { e.preventDefault(); if( oSettings.oApi._fnPageChange(oSettings, e.data.action) ) { fnDraw( oSettings ); } }; $(nPaging).addClass('pagination').append( '<ul>'+ '<li class="first disabled"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >'+oLang.sFirst+'</a></li>'+ '<li class="prev disabled"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >&larr; '+oLang.sPrevious+'</a></li>'+ '<li class="next disabled"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >'+oLang.sNext+' &rarr; </a></li>'+ '<li class="last disabled"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >'+oLang.sLast+'</a></li>'+ '<input type="text" style="width: 30px;padding-top: 5px;padding-bottom: 5px;height: 18px;border-left: 0px;border-radius: 0px 4px 4px 0px;" id="redirect" class="redirect">'+ '</ul>' ); //datatables分页跳转 $(nPaging).find(".redirect").keyup(function(e){ varipage = parseInt($(this).val()); varoPaging = oSettings.oInstance.fnPagingInfo(); if(isNaN(ipage) || ipage<1){ ipage = 1; }elseif(ipage>oPaging.iTotalPages){ ipage=oPaging.iTotalPages; } $(this).val(ipage); ipage--; oSettings._iDisplayStart = ipage * oPaging.iLength; fnDraw( oSettings ); }); varels = $('a', nPaging); $(els[0]).bind('click.DT', { action:"first" }, fnClickHandler ); $(els[1]).bind('click.DT', { action:"previous" }, fnClickHandler ); $(els[2]).bind('click.DT', { action:"next" }, fnClickHandler ); $(els[3]).bind('click.DT', { action:"last" }, fnClickHandler ); }, "fnUpdate":function( oSettings, fnDraw ) { variListLength = 5; varoPaging = oSettings.oInstance.fnPagingInfo(); varan = oSettings.aanFeatures.p; vari, ien, j, sClass, iStart, iEnd, iHalf=Math.floor(iListLength/2); if( oPaging.iTotalPages < iListLength) { iStart = 1; iEnd = oPaging.iTotalPages; } elseif ( oPaging.iPage <= iHalf ) { iStart = 1; iEnd = iListLength; }elseif ( oPaging.iPage >= (oPaging.iTotalPages-iHalf) ) { iStart = oPaging.iTotalPages - iListLength + 1; iEnd = oPaging.iTotalPages; }else{ iStart = oPaging.iPage - iHalf + 1; iEnd = iStart + iListLength - 1; } for( i=0, ien=an.length ; i<ien ; i++ ) { // Remove the middle elements ($('li:gt(1)', an[i]).filter(':not(:last)')).filter(':not(:last)').remove(); // Add the new list items and their event handlers for( j=iStart ; j<=iEnd ; j++ ) { sClass = (j==oPaging.iPage+1) ? 'class="active"': ''; $('<li '+sClass+'><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >'+j+'</a></li>') .insertBefore( $('.next', an[i])[0] ) .bind('click',function(e) { e.preventDefault(); oSettings._iDisplayStart = (parseInt($('a',this).text(),10)-1) * oPaging.iLength; fnDraw( oSettings ); } ); } // Add / remove disabled classes from the static elements if( oPaging.iPage === 0 ) { $('li:lt(2)', an[i]).addClass('disabled'); }else{ $('li:lt(2)', an[i]).removeClass('disabled'); } if( oPaging.iPage === oPaging.iTotalPages-1 || oPaging.iTotalPages === 0 ) { $('.next', an[i]).addClass('disabled'); $('li:last', an[i]).addClass('disabled'); }else{ $('.next', an[i]).removeClass('disabled'); $('li:last', an[i]).removeClass('disabled'); } } } }} );/* * TableTools Bootstrap compatibility * Required TableTools 2.1+ */if( $.fn.DataTable.TableTools ) { // Set the classes that TableTools uses to something suitable for Bootstrap $.extend(true, $.fn.DataTable.TableTools.classes, { "container":"DTTT btn-group", "buttons": { "normal":"btn", "disabled":"disabled" }, "collection": { "container":"DTTT_dropdown dropdown-menu", "buttons": { "normal":"", "disabled":"disabled" } }, "print": { "info":"DTTT_print_info modal" }, "select": { "row":"active" } } ); // Have the collection use a bootstrap compatible dropdown $.extend(true, $.fn.DataTable.TableTools.DEFAULTS.oTags, { "collection": { "container":"ul", "button":"li", "liner":"a" } } );}

好了，下面看下jQuery datatable中加入双击跳转功能

$('#topicDg tbody').on('dblclick','tr',function(){ var self=$(this); var id=self.find('.td-id').text(); var name=self.find('.td-name').text(); creatIframe("/post/postList.do?id="+id+"&name="+name,"帖子管理"); });

ps:点击话题列表中的一行，跳转到帖子列表中。