html 网站中的jQuery DataTable插件

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html 网站中的jQuery DataTable插件相关的知识，希望对你有一定的参考价值。

 jQuery DataTable Plug-in in Website
------------------------------------


A [Pen](https://codepen.io/harunpehlivan/pen/PBEGoQ) by [HARUN PEHLİVAN](https://codepen.io/harunpehlivan) on [CodePen](https://codepen.io).

[License](https://codepen.io/harunpehlivan/pen/PBEGoQ/license).
<?php
include "db_connect.php";
?>
<!DOCTYPE html>
<html>
<head>
	<title></title>
  <style>
  table,tr,td{
   border: 1px solid #000;
  }
  </style>
 
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css">
<script type="text/javascript" src="//code.jquery.com/jquery-1.12.4.js" ></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js" ></script>
 
<script type="text/javascript">
$(document).ready(function(){
$("#example").DataTable();
});
</script>
 
</head>
<body>
	<h3>jQuery DataTable Example</h3>
	<table id="example">
		<thead>
			<tr>
				<td>Id</td>
				<td>First Name</td>
				<td>Last Name</td>
				<td>Email</td>
			</tr>
		</thead>
		<tbody>
		<?php
		$sql=mysqli_query($con, "SELECT * FROM TABLE")
		while($row = mysqli_fetch_array($sql)) {
		?>
			<tr>
				<td><?php echo $row[1];?></td>
				<td><?php echo $row[2];?></td>
				<td><?php echo $row[3];?></td>
				<td><?php echo $row[4];?></td>
			</tr>
		<?php
		}
		?>
		</tbody>
	</table>
 
</body>
</html>

以上是关于html 网站中的jQuery DataTable插件的主要内容，如果未能解决你的问题，请参考以下文章

在Angular 2中的Jquery Datatable中绑定按钮事件

JQuery的datatable里搜索功能怎么修改

Jquery DataTable 中的滚动问题

jqyery dataTable 基本用法

带有页脚的jQuery DataTable没有响应

如何从 jQuery DataTable 中的所有页面中选择所有复选框