zoukankan      html  css  js  c++  java
  • jQuery ajax 动态append创建表格出现不兼容ie8

    非常多情况下。通过js(jQuery1.10)动态来创建一些样式,对页面的动态交互来说是非常方便的

    可是不同的浏览器针对动态生成的不是非常兼容,在此遇见的不兼容ie8。跟各位分享下

    代码:

         json数据

    data.json

    [{"name":"ajax","job":"manong"},{"name":"js","job":"diaosi"}]

    html页面

    <table class="ajaxappend">

    <thead></thead>

           <tbody></tbody>

    </table>

    js文件

    $document.ready(function(){

    .ajax(function(){

                    type:"post",

      url:"data.json",

    success:function(data){

    $(".ajaxappend tbody").append("<tr>");

    $(".ajaxappend thead").append("<th>name</th>");

    $(".ajaxappend thead").append("<th>job</th>");

    $(".ajaxappend tbody").append("</tr>");

    for(int i = 0,l = data.length; i < l; i = i+1){

    $(".ajaxappend tbody").append("<tr>");

    for(var key in data[i]){

    $(".ajaxappend tbody").append("<td>"+data[i][key]+"</td>");

    }

    $(".ajaxappend tbody").append("</tr>");

    }

    }

    });

    });


    上面的效果在火狐下是可以正常动态生成出表格的

    可是在ie8却不行,经过几次验证。猜測,ie对动态append的内容有要求,须要将一个具有完整意义的html一起append到代码中


    改动例如以下

    $document.ready(function(){

    .ajax(function(){

                    type:"post",

      url:"data.json",

    success:function(data){

    var head="";

    var body ="";

    head = head + "<tr><th>name</th><th>job</th></tr>";

    for(int i = 0,l = data.length; i < l; i = i+1){

                                    body = body + “<tr>";

    for(var key in data[i]){

         body = body + "<td>"+data[i][key]+"</td>";

    }

    body = body + "</tr>";        

    }

    ·  $(".ajaxappend tbody").append(body);

           

    }

    });

    });

    这样ie8和火狐下都能够正常显示了


  • 相关阅读:
    Linux文件系统结构
    JAVA实现上传下载共享文件
    JAVA 实现通过URL下载文件到本地库
    使用SoapUI 测试 Web Service
    DB2存储过程实现查询表数据,生成动态SQL,并执行
    DB2查看表空间大小及使用情况
    Spring使用总结
    Commons-logging + Log4j
    JAVA生成EXCEL图表
    html5离线缓存原理
  • 原文地址:https://www.cnblogs.com/lxjshuju/p/6796083.html
Copyright © 2011-2022 走看看