zoukankan      html  css  js  c++  java
  • JS中将ajax请求返回json数据动态生成表格显示在div中

    1、页面内容

    <div style="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="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("无数据!");
                 
                 }

  • 相关阅读:
    docker微服务部署之:三,搭建Zuul微服务项目
    docker微服务部署之:二、搭建文章微服务项目
    docker微服务部署之:一,搭建Eureka微服务项目
    docker安装Tomcat软件,部署项目
    tomcat运行springboot项目war包
    使用Docker构建jdk1.8镜像
    docker安装MySQL软件
    InvalidKeyException: Illegal key size
    BeanUtils.copyProperties实现po,vo,dto之间的转换
    java集合之HashMap源码解读
  • 原文地址:https://www.cnblogs.com/shoose/p/7660639.html
Copyright © 2011-2022 走看看