页面效果如下
js代码如下:
<script type="text/javascript"> $(document).ready(function () { top.document.getElementById("jysd").className = "table_navigate_click"; top.document.getElementById("ylxx").className = ""; top.document.getElementById("swxx").className = ""; //iframe默认高度为0 top.document.getElementById("iframe_list").height = 0; $.ajax({ type: "get", dataType: "text", url: "../ShuiWu/GetJSDData", async: false,//修改Ajax请求为同步 success: function (data) { if (data != "") { // 由JSON字符串转换为JSON对象 var dataJSON = eval("(" + data + ")"); var len = dataJSON.length; var tb_list = document.getElementById("table_list"); for (var i = 0; i < len; i++) { var row = document.createElement("tr"); var col1 = document.createElement("td"); col1.className = "table_list_td1"; col1.align = "left"; col1.setAttribute("style","padding-left:8px;"); col1.innerHTML = dataJSON[i].dlmc; //列添加到行 row.appendChild(col1); var col2 = document.createElement("td"); col2.innerHTML = dataJSON[i].depth.toFixed(2); row.appendChild(col2); var col3 = document.createElement("td"); col3.innerHTML = new Date(dataJSON[i].jcsj.replace(/-/g,"/")).Format("MM/dd HH:mm"); //replace正则表达式替换"-" row.appendChild(col3); //行添加到table tb_list.appendChild(row); } //iframe根据内容自适应高度 top.document.getElementById("iframe_list").height = document.body.scrollHeight; } }, error: function (XMLHttpRequest,textStatus,errorThrown) { alert(errorThrown); } }); }); //时间格式化 Date.prototype.Format = function (fmt) { var o = { "M+": this.getMonth() + 1,//月份 "d+": this.getDate(),//日 "H+": this.getHours(),//小时 "m+": this.getMinutes(),//分 "s+": this.getSeconds(),//秒 }; if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1,(this.getFullYear() + "").substr(4 - RegExp.$1.length)); for (var k in o) if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1,(RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length))); return fmt; } </script>
html页面代码:
<div> <table id="table_list" cellpadding="0" cellspacing="0" class="table_list"> <tr class="table_list_tr_head"> <td>积水点名称</td> <td style="width:16%;">深度(cm)</td> <td style="width:30%;">监测时间</td> </tr> </table> </div> (编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|