JS中將ajax請求返回json數據動態生成表格顯示在div中


1、頁面內容

<div style="width:900px;height:400px;" id="tableInfo"></div>

 

2、js內容

 $.ajax({    //使用JQuery內置的Ajax方法
         type : "post",        //post請求方式
         async : true,        //異步請求(同步請求將會鎖住瀏覽器,用戶其他操作必須等待請求完成才可以執行)
         url : "countVersion.action",    //請求發送到ShowInfoIndexServlet處
         data : productversions,        //請求內包含一個key為name,value為損壞數的參數;服務器接收到客戶端請求時通過request.getParameter方法獲取該參數值
         dataType : "json",        //返回數據形式為json
         success : function(result) {
             //請求成功時執行該函數內容,result即為服務器返回的json對象
             if (result != null && result.length > 0) {

    //動態生成表格
                var tableInfos = document.getElementById('tableInfo');
                 var code = '<TABLE style="width:900px;height:350px;" border="1">';
                 code += '<TR><TH>產品</TH><TH>數量</TH></TR>';
                 for(var i=0;i<result.length;i++){       
                 
                        code += '<TR><TD>'+result[i].version+'</TD><TD>'+result[i].count+'</TD></TR>';
                    }
                 tableInfos.innerHTML = code + '</TABLE>';
             }else {
        
                 alert("無數據!");
             
             }


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM