如何使用java脚本在html动态表中显示编辑和删除按钮

时间:2017-09-13 08:38:36

标签: javascript

function ViewTable(data)
     {

         var html = '<table>';
         html += '<tr>';

         for (var j in data[0]) {
             html += '<th>' + j + '</th>';
         }
         html += '</tr>';
         for (var i = 0; i < data.length; i++) {
             html += '<tr>';
             for (var j in data[i]) {

                 html += '<td>' + data[i][j] + '</td>';
             }

         }
         html += '</table>';
         document.getElementById('divRecords').innerHTML = html;

     }

我想在每行的末尾添加编辑和删除子句 请有人帮我摆脱这个。

1 个答案:

答案 0 :(得分:1)

以下情况应该有效。

    var html = '<table>';
     html += '<tr>';

     for (var j in data[0]) {
         html += '<th>' + j + '</th>';
     }
     html += '<th colspan="2">Actions</th>'
     html += '</tr>';
     for (var i = 0; i < data.length; i++) {
         html += '<tr>';
         for (var j in data[i]) {

             html += '<td>' + data[i][j] + '</td>';
         }
        html += '<td><a href="#">edit</td><td> | <a href="#">delete</td></tr>';
     }
     html += '</table>';
     document.getElementById('divRecords').innerHTML = html;

样本数据:

var data = [
  [1, 2],
  [3, 4],
  [5, 6]
];

表格如下

enter image description here