jquery动态添加List内容的Table,通过append

  <div id="QuestionList" style="float: left; width: 50%; height: 40%; margin: 0px,0px,0px,0px; "></div>

  function ShowIssueTable(lst) {//lst为List数据集合
        $('#QuestionList').html("");//现将<div>内容清空
        var $trTitle1 = $("<tr style='border:solid black 1px;border-collapse:collapse'></tr>");
        $trTitle1.append("<td style='text-align:center;width:60px;border:solid black 1px;border-collapse:collapse'>机种</td>");
        $trTitle1.append("<td style='text-align:center;width:300px;border:solid black 1px;border-collapse:collapse'> 原因</td>");
        $trTitle1.append("<td style='text-align:center;width:300px;border:solid black 1px;border-collapse:collapse'> 对策</td>");
        $trTitle1.appendTo("#QuestionList'");//将表头内容添加到QuestionList中
        var reg = new RegExp("\r\n", "g");//g,表示全部替换
        for (var count = 0; count < lst.length; count++) {//循环添加行内容
            lst[count].Action = lst[count].Action.replace(reg, "<br/>")//换行替换
            var $trData = $("<tr style='border:solid black 1px;border-collapse:collapse'></tr>");
            $trData.append("<td style='text-align:left;border:solid black 1px;border-collapse:collapse;font-size:12px'>" + lst[count].Model + "</td>");
            $trData.append("<td style='text-align:left;border:solid black 1px;border-collapse:collapse;font-size:12px'>" + lst[count].RootCause + "</td>");
            $trData.append("<td style='text-align:left;border:solid black 1px;border-collapse:collapse;font-size:12px'>" + lst[count].Action + "</td>");
            $trData.appendTo("#QuestionList'");//将行内容添加到QuestionList中
        }
    }

猜你喜欢

转载自blog.csdn.net/ai_feng123/article/details/81353214