jquery datatable(二)

时间:2023-03-08 16:47:28
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <link href="..//javascript/datatables-1.10.8/media/css/jquery.datatables.min.css" rel="stylesheet" />
    <link href="..//javascript/datatables-1.10.8/media/css/datatables.jqueryui.min.css" rel="stylesheet" />
    <link href="..//javascript/datatables-1.10.8/media/css/datatables.foundation.min.css" rel="stylesheet" />
    <link href="..//javascript/datatables-1.10.8/media/css/datatables.bootstrap.min.css" rel="stylesheet" />
    <script src="..//javascript/datatables-1.10.8/media/js/jquery.js"></script>
    <script src="..//javascript/datatables-1.10.8/media/js/jquery.datatables.min.js"></script>
    <script src="..//javascript/datatables-1.10.8/media/js/datatables.jqueryui.min.js"></script>
    <script src="..//javascript/datatables-1.10.8/media/js/datatables.foundation.min.js"></script>
    <script src="..//javascript/datatables-1.10.8/media/js/datatables.bootstrap.min.js"></script>

</head>
<body>
    <table id="tb1">
        <thead><tr><th>编号</th><th>姓名</th></tr></thead>
    </table>

    <script type="text/javascript">
        $("#tb1").dataTable({
            "bAutoWidth": false,//自适应宽度
            "aaSorting": [[1, "asc"]],
            "sPaginationType": "full_numbers",
            "oLanguage": {
                "sProcessing": "正在加载...",
                "sLengthMenu": "每页显示_MENU_条记录",
                "sZeroRecords": "对不起,查询不到相关数据",
                "sEmptyTable": "数据表*_MAX_条记录",
                "sSearch": "搜索",
                "oPaginate":
                    {
                        "sFirst": "首页",
                        "sPrevious": "上一页",
                        "sNext": "下一页",
                        "sLast": "末页"
                    }
            },//多语言配置

            "bProcessing": true,
            "bDestroy": true,
            "columns":
                [
                    { "data": "id"},
                    { "data": "name" }
                ],
            "data":[
                {"id":"xx","name":"sdf"}
            ]
        });
    </script>
</body>
</html>