bootstrap图片大小设置方法 bootstrap上传图片插件( 二 )

我们写一个函数取数据：
/*将数据取出来*/function data(curr, limit) {//console.log("tot:"+totalCount)/*拿到总数据*/totalCount = testboke.data.total; //取出来的是数据总量dataLIst = testboke.data.records; // 将数据放到一个数组里面（dataLIst 还未声明，莫着急）createTable(curr, limit, totalCount); console.log("tot:"+totalCount)}拿到数据以后怎么做，分页，是的，不是急着将数据放到表格里面，先分页，ok我们加载分页的js（bootstrap的分页js）
<link href="https://www.520longzhigu.com/css/font-awesome.min.css" rel="stylesheet" /><link href="https://www.520longzhigu.com/css/bootstrap.min.css" rel="stylesheet" /><link href="https://www.520longzhigu.com/css/templatemo-style.css" rel="stylesheet" /><link href="https://www.520longzhigu.com/css/layui/css/layui.css" rel="stylesheet" /><script src="https://www.520longzhigu.com/js/bootstrap.min.js" type="text/javascript"></script><script src="https://www.520longzhigu.com/js/jquery-1.8.3-min.js" type="text/javascript"></script><script src="https://www.520longzhigu.com/js/jquery.min.js" type="text/javascript"></script><script src="https://www.520longzhigu.com/js/extendPagination.js" type="text/javascript"></script><script src="https://www.520longzhigu.com/js/layui/lay/dest/layui.all.js" type="text/javascript"></script><script src="https://www.520longzhigu.com/js/testcode.js" type="text/javascript"></script>上面的这些js，css都可以去cdn上面找到，除了testcode，在最上面，就是我们加载数据的js 。
下面就是将分页的代码写上：
var currPage = 1;var totalCount;var dataLIst = [];window.onload = function() {/*取到总条数*//*每页显示多少条 10条*/var limit = 10;data(currPage, limit)//console.log(totalCount)createTable(1, limit, totalCount);$('#callBackPager').extendPagination({totalCount: totalCount,limit: limit,callback: function(curr, limit, totalCount) {data(curr, limit)}});}加载以后的效果是这样的：
这个时候就是已经基本将数据处理好了，只是没有将数据放进去，最后我们将数据放进去就可以了，（我的写法不建议借鉴，很多现成的循环画表格的方法，我是原生的拼接字符串写的，不嫌麻烦的可以自己拼一下，毕竟不管是什么框架，最底层的还是这样的实现原理）
/*创建的是一个表格，并将数据放进去*/function createTable(currPage, limit, total) {var html = [],showNum = limit;if(total - (currPage * limit) < 0) showNum = total - ((currPage - 1) * limit);html.push(' <table class="table table-striped table-bordered templatemo-user-table" style="margin-left: 0;">');html.push(' <thead><tr><th>序号</th><th>项目名称</th><th>类别</th><th>发起人</th><th>单位</th><th>详情</th><th>操作</th></tr></thead><tbody>');for(var i = 0; i < showNum; i++) {html.push('<tr>');html.push('<td>' + dataLIst[i].id + '</td>');

以上关于本文的内容，仅作参考！温馨提示：如遇健康、疾病相关的问题，请您及时就医或请专业人士给予相关指导!

「四川龙网」www.sichuanlong.com小编还为您精选了以下内容，希望对您有所帮助：