Created
February 18, 2016 07:10
-
-
Save maninthemirror/9ed66e42138cae9040b9 to your computer and use it in GitHub Desktop.
把12筆資料用 9 個換頁
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| [ | |
| {"id":1,"name":"name_1"}, | |
| {"id":2,"name":"name_2"}, | |
| {"id":3,"name":"name_3"}, | |
| {"id":4,"name":"name_4"}, | |
| {"id":5,"name":"name_5"}, | |
| {"id":6,"name":"name_6"}, | |
| {"id":7,"name":"name_7"}, | |
| {"id":8,"name":"name_8"}, | |
| {"id":9,"name":"name_9"}, | |
| {"id":10,"name":"name_10"}, | |
| {"id":11,"name":"name_11"}, | |
| {"id":12,"name":"name_12"} | |
| ] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script> | |
| <script> | |
| $(function(){ | |
| $.getJSON("data.json",function(data){ | |
| //先算出要幾個大盒子 | |
| if((data.length % 9) == 0){ | |
| var p = data.length / 9; | |
| }else{ | |
| var p = (data.length / 9)+1; | |
| } | |
| //放入大盒子 | |
| for(var i = 0;i<p;i++){ | |
| //製造九個小盒子 | |
| var small = ''; | |
| for(var si = 0;si < 9 ; si++){ | |
| small = small+'<div class="s"></div>'; | |
| } | |
| //小盒子放入大盒子 | |
| var big = '<div class="big">'+small+'</div>'; | |
| //大盒子放入畫面 | |
| $("body").append(big); | |
| } | |
| //跑一次資料 | |
| $.each(data,function(k,v){ | |
| //把資料填入小盒子 | |
| $(".small").text(v.name); | |
| }) | |
| }) | |
| }) | |
| </script> | |
| </head> | |
| <body> | |
| </dody> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment