静态页面的翻页
来源：互联网 发布：淘宝一千零一夜从哪看 编辑：程序博客网 时间：2024/05/16 12:20
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>翻页</title>
<link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(function(){
fanye(3);
})
var p = 31;
// var d = Math.random();
var data = ["<tr><td>1</td><td>2</td><td>3</td></tr>",
"<tr><td>4</td><td>5</td><td>6</td></tr>",
"<tr><td>7</td><td>8</td><td>9</td></tr>"];
function fanye(innerHTML){
var d = Math.random();
$("table tbody").children().remove();
if((innerHTML * 10 - 1) < p) {
for(var i = 0; i < 10; i++) {
if(d < 0.33) {
$("table tbody").append(data[0]);
}else if(d < 0.66) {
$("table tbody").append(data[1]);
}else if(d < 0.99) {
$("table tbody").append(data[2]);
}
}
} else {
for(var i = 0; i < 5; i++) {
if(d < 0.33) {
$("table tbody").append(data[0]);
}else if(d < 0.66) {
$("table tbody").append(data[1]);
}else if(d < 0.99) {
$("table tbody").append(data[2]);
}
}
}
}
</script>
</head>
<body>
<div class="panel panel-default">
<div class="panel-heading">翻页</div>
<div class="panel-body">
<table class="table table-bordered">
<thead>
<tr>
<th>我的电脑</th>
<th>我的课本</th>
<th>发布时间</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div class="panel-footer">
<ul class="pagination pagination-lg">
<li>
<a href="#">第一页</a>
</li>
<li>
<a href="#" onclick="fanye(this.innerHTML)">1</a>
</li>
<li>
<a href="#" onclick="fanye(this.innerHTML)">2</a>
</li>
<li class="active">
<a href="#" onclick="fanye(this.innerHTML)">3</a>
</li>
<li>
<a href="#" onclick="fanye(this.innerHTML)">4</a>
</li>
<li class="disabled">
<a href="#">最后页</a>
</li>
</ul>
</div>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
</body>
</html> 0 0
- 静态页面的翻页
- 静态页面翻页效果
- 静态页面翻页效果
- CSS+JS实现的静态页面翻页效果
- CSS+JS实现的静态页面翻页效果
- CSS+JS实现的静态页面翻页效果
- JSP页面翻页技术的实现
- 移动端页面平滑翻页的解决方案
- ajax静态页面无刷新添加留言，无刷新分页，翻页综合应用
- ajax静态页面无刷新添加留言，无刷新分页，翻页综合应用
- 静态页面的生成
- 页面静态的方案
- 页面的静态huan
- 页面滚动条翻页
- 无需跳转页面就能翻页的效果~
- Viewpager+Fragment去除页面切换时的滑动翻页效果
- 动态页面，静态页面，伪静态页面的区别
- 动态页面静态化的静态化
- Java 泛型相关
- codeforces 733F. Drivers Dissatisfaction
- 11月8日 课程设计幸运抽奖系统
- [Usaco07Oct] Bessie's Secret Pasture
- 哈密顿绕行世界问题
- 静态页面的翻页
- 一、Django框架创建
- 代理模式通用模板实现
- C++ 中的单例模式
- NOIP2014无线网络发射选址【Pascal】
- 写在uboot移植前的话
- 用poi导文件外部的excel表
- Android布局优化
- 百度网盘私密分享自定义提取码
