jQuery中Datatables增加跳转到指定页功能

var

mytable = $('#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){

        return

obj.group;

      }},

      {"mData":"yiyuan"},

      {"mData":function(obj){

        return

obj.keshi;

      }},     

      {"mData":function(obj){

        if(obj.Status==1){

          return

"使用中";

        }else{

          return

"禁用";

        }

      }},     

      {"mData":

function(obj){

        var

del="";

        if(isAdmin){

          del='

 data-title="'

+ obj.Id +'"

 class="btn btn-danger">删除';

        }

       return

'

 class="btn btn-success" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >修改'

+'  '+del;

      },bSortable

 :false}

    ],

    "fnDrawCallback":

function(){

      var

oTable = $("#datatables").dataTable();

      $('#redirect').keyup(function(e){

        if($(this).val()

 && $(this).val()>0){

          var

redirectpage = $(this).val()-1;

        }else{

          var

redirectpage = 0;

        }

        oTable.fnPageChange(

 redirectpage );

      });

    }

   });

bootstrap插件形式：

/*

 Set the defaults for DataTables initialisation */

$.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":"

 style=''>加载中...",

    "oPaginate":

 {

      "sPrevious":

"",

      "sNext": 

"",

      "sLast": 

">>",

      "sFirst": 

"<<"

    }

  }

}

 );

/*

 Default class modification */

$.extend(

 $.fn.dataTableExt.oStdClasses, {

  "sWrapper":

"dataTables_wrapper

 form-inline"

}

 );

/*

 API method to get paging information */

$.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 )

  };

};

/*

 Bootstrap style pagination control */

$.extend(

 $.fn.dataTableExt.oPagination, {

  "bootstrap":

 {

    "fnInit":

function(

 oSettings, nPaging, fnDraw ) {

      var

oLang = oSettings.oLanguage.oPaginate;

      var

fnClickHandler =function

( e ) {

        e.preventDefault();

        if

( oSettings.oApi._fnPageChange(oSettings, e.data.action) ) {

          fnDraw(

 oSettings );

        }

      };

      $(nPaging).addClass('pagination').append(

        '

'+

        '

 class="first disabled">'+oLang.sFirst+''+

        '

 class="prev disabled">← '+oLang.sPrevious+''+

        '

 class="next disabled">'+oLang.sNext+'

 → '+

        '

 class="last disabled">'+oLang.sLast+''+

        '

 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">'+

        '

        );

     //datatables分页跳转

     $(nPaging).find(".redirect").keyup(function(e){

       var

ipage = parseInt($(this).val());

       var

oPaging = oSettings.oInstance.fnPagingInfo();

       if(isNaN(ipage)

 || ipage<1){

         ipage

 = 1;

       }else

if(ipage>oPaging.iTotalPages){

         ipage=oPaging.iTotalPages;

       }

       $(this).val(ipage);

        ipage--;

       oSettings._iDisplayStart

 = ipage * oPaging.iLength;

       fnDraw(

 oSettings );

     });

      var

els = $('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 ) {

      var

iListLength = 5;

      var

oPaging = oSettings.oInstance.fnPagingInfo();

      var

an = oSettings.aanFeatures.p;

      var

i, ien, j, sClass, iStart, iEnd, iHalf=Math.floor(iListLength/2);

      if

( oPaging.iTotalPages < iListLength) {

        iStart

 = 1;

        iEnd

 = oPaging.iTotalPages;

      }

      else

if

( oPaging.iPage <= iHalf ) {

        iStart

 = 1;

        iEnd

 = iListLength;

      }

else

if

( 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

        //

 Remove the middle elements

        ($('li:gt(1)',

 an[i]).filter(':not(:last)')).filter(':not(:last)').remove();

        //

 Add thenewlist items and their event handlers

        for

( j=iStart ; j<=iEnd ; j++ ) {

          sClass

 = (j==oPaging.iPage+1) ?'class="active"'

:'';

          $('

 '+sClass+'>

 href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >'+j+'')

          .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 suitableforBootstrap

  $.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"

    }

  }

 );

}

$('#topicDg tbody').on('dblclick','tr',function(){

 varself=$(this);

 varid=self.find('.td-id').text();

 varname=self.find('.td-name').text();

 creatIframe("/post/postList.do?id="+id+"&name="+name,"帖子管理");

});