php实战第八天
今天是学习做后台页面布局,用得是bootcss。那么效果展示一下。
布局的代码
[html] <!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"></head>
<body>
<div class="container-fluid">
<div class="row-fluid">
<div class="span4">
<h3>瀑布流留言板管理系统</h3>
</div>
</div>
<div class="row-fluid">
<div id="menu" class="span2">
<ul class="nav nav-list">
<li class="nav-header">留言管理</li>
<li class="active">
<a id="start" href="javascript:void(0);">所有留言</a>
</li>
<li class="nav-header">网站管理</li>
<li class="">
<a href="javascript:void(0);">基本设置</a>
</li>
</ul>
</div>
<div id="main" class="span10">
<div id="mainData"></div>
</div>
</div>
</div>
</body>
<script src="js/jquery-2.0.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/admin.js"></script>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"></head>
<body>
<div class="container-fluid">
<div class="row-fluid">
<div class="span4">
<h3>瀑布流留言板管理系统</h3>
</div>
</div>
<div class="row-fluid">
<div id="menu" class="span2">
<ul class="nav nav-list">
<li class="nav-header">留言管理</li>
<li class="active">
<a id="start" href="javascript:void(0);">所有留言</a>
</li>
<li class="nav-header">网站管理</li>
<li class="">
<a href="javascript:void(0);">基本设置</a>
</li>
</ul>
</div>
<div id="main" class="span10">
<div id="mainData"></div>
</div>
</div>
</div>
</body>
<script src="js/jquery-2.0.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/admin.js"></script>
</html>
从中学到javascript函数
str.substr(0,20)意思是从0个字符开始取20个字符
Math.random()取随机数
switch语句
这后台是ajax的噢。写了好久的分页呢。好吧,直接上代码。
[javascript] // JavaScript Document
$('body').off('.data-api');
$(document).ready(function(e) {
$("#menu a").click(function() {
switch ($(this).text()) {
case '所有留言':
admin_content(1);
break;
case '基本设置':
$("#main #mainData").load('admin_config.html?r='+Math.random());
break;
default:
break;
}
});
$("#start").click();
});
/**
*留言管理
*/
function admin_content(page) {
$.ajax({
url: 'http://localhost/l/admin.php?m=admin&a=content&page=
补充:Web开发 , php ,