?暫時夠用，不夠用再補充 T_T

?

script:

<link rel="stylesheet" href="lib/bootstrap.min.css"> <!-- table css--> <link rel="stylesheet" href="lib/bootstrap-table.css"><script src="lib/jquery-1.11.1.min.js"></script> <script src="lib/bootstrap.min.js"></script> <!--table js--> <script src="lib/bootstrap-table.js"></script> <script>$(function () {var data = [{uid: "7791",name: "keenleung1",age: "26",height: "165",description: "描述"},{uid: "7792",name: "keenleung2",age: "26",height: "165",description: "描述"},{uid: "7793",name: "keenleung3",age: "26",height: "165",description: "描述"},{uid: "7794",name: "keenleung4",age: "26",height: "165",description: "描述"},{uid: "7795",name: "keenleung5",age: "26",height: "165",description: "描述"},];$('#table').bootstrapTable('load', data);var $result = $('#eventsResult');// 選擇一行$('#table').on('click-row.bs.table', function (e, row, $element) {alert(JSON.stringify(row.uid));});});function actionFormatter(value, row, index) {return ["<button class='btn btn-primary like'>選取</button>","<button class='btn btn-default unlike'>取消</button>",].join('');}window.actionEvents = {'click .like': function (e, value, row, index) {alert(JSON.stringify(row));return false;},'click .unlike': function (e, value, row, index) {alert("unlike click");return false;},}; </script> <style type="text/css"></style> <script type="text/javascript"></script>

html:

<div class="alert alert-success" id="eventsResult">Here is the result of event. </div> <table id="table" data-toggle="table"><thead><tr><th data-field="name">姓名</th><th data-field="age">年齡</th><th data-field="height">身高</th><th data-field="description">描述</th><th class="text-left" data-field="action" data-formatter="actionFormatter" data-events="actionEvents">操作</th></tr></thead> </table>

?

>>>source in GIT

官網案例：http://bootstrap-table.wenzhixin.net.cn/zh-cn/examples/?

?

轉載于:https://www.cnblogs.com/KeenLeung/p/6496626.html

總結

以上是生活随笔為你收集整理的bootstrap table 的简单Demo的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。