请知悉:本文最近一次更新为 8年 前,文中内容可能已经过时。

不多说,原始翻页按钮配合bootstrap挺好,不过没有输入框跳转,而官方插件感觉又不是那么舒爽,所以改了改,初始代码如下:

var dataTables=$('.dataTables').dataTable({
"fnDrawCallback": function( oSettings ) {
$(".pagination").append('<li><input style="background-color: rgb(255, 255, 255); padding: 3px 10px; width: 18%; margin-left: 5px; margin-right: -124px;" value="" class="jumppage" placeholder="页数" type="text"></li>');
$(".jumppage").keyup( function (e) {
if ( e.which == 13){
if ( this.value === "" || this.value.match(/[^0-9]/) ){
this.value = this.value.replace(/[^d]/g, '');
return;
}
var iNewStart = oSettings._iDisplayLength * (this.value - 1);
if (iNewStart < 0)
{
iNewStart = 0;
}
if (iNewStart >= oSettings.fnRecordsDisplay())
{
iNewStart = (Math.ceil((oSettings.fnRecordsDisplay() - 1) / oSettings._iDisplayLength) - 1) * oSettings._iDisplayLength;
}
oSettings.iInitDisplayStart = iNewStart;
dataTables.fnDraw( oSettings );
}
} );
},
"ajax": {
"url": "test.php",
"dataType": "jsonp",
"type": "POST"
},
});

如您从本文得到了有价值的信息或帮助,请考虑扫描文末二维码捐赠和鼓励。

尊重他人劳动成果。转载请务必附上原文链接,我将感激不尽。


与《jQuery表格插件ajax数据-翻页按钮添加输入框跳转示例》相关的博文:


留言

Admin Avatar
😀
😀😁😂😅😭🤭😋😘🤔😰😱🤪💪👍👎🤝🌹👌