Question

全晚，

我正在使用Datatables的这个jQuery示例

https://www.datatables.net/examples/api/multi_filter.html

我想将当前显示在页面底部的搜索框放在标题下方，例如所以我仍然有大胆的标题，有能力排序，但下面是过滤箱，我可以根据需要过滤。

页面上有一些评论，JavaScript声称可以正常工作，但我无法让任何工作完全按照我的意愿工作！？

任何帮助都将非常感谢!!!

Answer 1

以下小提琴在尝试实现您在问题中描述的内容（将表格标题标题下方的输入排序框移动）时进行了微小的更改：

https://jsfiddle.net/r1dbw6u2/4/

javascript更改功能可以概括为：

$(document).ready(function() {
// Setup - add a text input to each footer cell
$('#example thead th').each( function () {
    var title = $(this).text();
    $(this).append( '<input type="text" placeholder="Search '+title+'" />' );
} );

// DataTable
var table = $('#example').DataTable();

// Apply the search
table.columns().every( function () {
    var that = this;

    $( 'input', this.header() ).on( 'click', function(e) {
        e.stopPropagation();
    } );

    $( 'input', this.header() ).on( 'keyup change', function () {
        if ( that.search() !== this.value ) {
            that
                .search( this.value )
                .draw();
        }
    } );
} );

jQuery DataTables JavaScript移动搜索框

1 个答案: