jQuery 데이터 테이블이란 무엇입니까? 데이터 테이블을 사용하는 방법?

Datatables 소개

DataTables는 jQuery 테이블 플러그인입니다. 이는 고급 대화형 컨트롤을 추가하고 모든 HTML 양식을 지원하는 점진적인 향상을 기반으로 하는 매우 유연한 도구입니다. 주요 기능:

• 자동 페이징 처리

• 인스턴트 테이블 데이터 필터링

• 데이터 정렬 및 데이터 유형 자동 감지

• 자동 열 너비 처리

ㅋㅋㅋ
• 국제화

• 업데이트 만들기 form

• Free

• 2. 사용방법

  백엔드를 할 때 페이지를 표시하기 위해 협력할 아티스트나 프론트엔드 엔지니어가 없습니다. 미적인 느낌이 있으면 jQuery의 DataTables 플러그인을 사용하여 작업을 완료할 수 있습니다

1. DataTables의 기본 구성

•  $(document).ready(function() { 
  $('#example').dataTable(); 
  } );

  2.

•  "bPaginate": true, //翻页功能 
  "bLengthChange": true, //改变每页显示数据数量 
  "bFilter": true, //过滤功能 
  "bSort": false, //排序功能 
  "bInfo": true,//页脚信息 
  "bAutoWidth": true//自动宽度

3 , 데이터 정렬

$(document).ready(function() { 
$('#example').dataTable( { 
"aaSorting": [ 
[ 4, "desc" ] 
] 
} ); 
} );

0열부터 시작하여 4열부터 역순으로 정렬

4. 일부 열 숨기기

$(document).ready(function() { 
$('#example').dataTable( { 
"aoColumnDefs": [ 
{ "bSearchable": false, "bVisible": false, "aTargets": [ 2 ] }, 
{ "bVisible": false, "aTargets": [ 3 ] } 
] } ); 
} );

5 , 국제화

$(document).ready(function() { 
$('#example').dataTable( { 
"oLanguage": { 
"sLengthMenu": "每页显示 _MENU_ 条记录", 
"sZeroRecords": "抱歉， 没有找到", 
"sInfo": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据", 
"sInfoEmpty": "没有数据", 
"sInfoFiltered": "(从 _MAX_ 条数据中检索)", 
"oPaginate": { 
"sFirst": "首页", 
"sPrevious": "前一页", 
"sNext": "后一页", 
"sLast": "尾页" 
}, 
"sZeroRecords": "没有检索到数据", 
"sProcessing": "<img src=&#39;./loading.gif&#39; />" 
} 
} ); 
} );

6. 정렬 기능:

$(document).ready(function() { 
$('#example').dataTable( { 
"aoColumns": [ 
null, 
{ "asSorting": [ "asc" ] }, 
{ "asSorting": [ "desc", "asc", "asc" ] }, 
{ "asSorting": [ ] }, 
{ "asSorting": [ ] } 
] 
} ); 
} );

7. 데이터 수집은 4가지 유형을 지원합니다. Follow

•DOM 문서 데이터

•Javascript 배열 js 배열

•Ajax 소스 Ajax 요청 데이터

• 
  •서버측 처리 서버측 데이터

위 내용은 jQuery 데이터 테이블이란 무엇입니까? 데이터 테이블을 사용하는 방법?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!