HTMLカラーブロックを使用して、データを動的に表示します
<スタイルタイプ/css> *{マージン:0;} {width:float:height:25px;} :5%; 100%; <body> <div class = tubiao> <div class = jihua> <div class = left> plan </div> <! - プランが保存される場所 - > <div class = right plan> </div> < /div> </div> <div class = shiji> <div class = left>実際の</div> <! - 実際のスパン保存場所 - > <div class = right act> </div> </div> < div class> = riqi id = day_id> <! - where the date store-> <div class = right day> </div> </div> </div> <script type = text/javascript> var temp1 = 0- 0.5 -2-2-2-1-1; 19-5/20-5/21-5/22-5/23-5/24-5/26-5/27-5/28; ; var plan.getelementsby(計画)[0] [0)]; Load_firsの多くのグリッド(//セグメントデータload_first(var demp.split); - 消費計画(ブロック幅)アレイvar d2 = demo [1] .split( - ); (var i = 0; i <d3.length; i ++){time_span(d3 [i]);} // alert(6:+d1.length+------------ ----- +3:+d2.length); [i]、d2 [i]、i);} document.getElementbyId(day_id).style.marginLeft = -30px;} //カラーブロックを追加します。Aはプランカラーブロックの幅、Bは実際のカラーブロックです幅function add_span(a、b、i){// 0,255)+、+ rnd(0,255)+、+ rnd(0,255)+、+ rnd(0.5,1)+) // clientWidthはオブジェクトの幅(オブジェクトの幅(エッジラインなし、つまり境界線なし)span1.style.width =(plan.clientwidth/num*a) + px; //各幅の幅プランのグリッドプラン(SPAN1)を挿入します各グリッドのグリッドatt.appndchild(span2);} else {// alert(a+b:+b+i:+i); span1.style.width =(plan.clientwidth/num*a)+px; ; //クライアント装置は、オブジェクトの幅、境界線を除く) Plan.AppendChild(SPAN1);} if(b == 0){backgroundcolor = 000000; ACT.AppendChild(SPAN2);} span2.Spa.Spa.width =(plan.ClientWidth/num*) (span2);}} // function time_span(time){// span block var span = document.createelement(span); //各スパンの幅。innerhtml; day.app endchild(span);} min); ajax(type:post、url:test.aspx、dattype:{dispalystyle:displaystyle}、error:function(xmlhttprequest、textstatus、error thrown) 、成功:function(json){try {load_first(json);} catch(e){}}});} // querydata();上記は、HTMLが編集者があなたにそれを紹介するカラーブロックの動的な表示を実現するレポート効果です。 Xiaobianは、すべての人に時間内に返信します。 VEVBウーリンのウェブサイトへのご支援ありがとうございます!