当前位置: 代码迷 >> JavaScript >> 向datatables行添加多个自定义属性
  详细解决方案

向datatables行添加多个自定义属性

热度:48   发布时间:2023-06-07 15:54:53.0

我在DataTables 1.10中创建了一个表:

var table = $('#table').DataTable( {    
      "data" : dataSet,                      
      "bInfo": false,
      "bFilter" : false,
      paging: false,
      "createdRow" : function (row,data,index) {      
      $('td',row).eq(0).attr('id', 'cost-' + index);
      $('td',row).eq(1).attr('id', 'resale-' + index);

      deleteImage = $('<img />').attr('src', '../../img/details_close.png');           
      $('td',row).eq(0).append(deleteImage);      
      $('td',row).eq(0).addClass( 'icons' );

    },
      "columns" : [        
        { title : 'Cost' },
        { title : 'Resale' },        
    ],
    "columnDefs": [
    { className: "details-control", "targets": [ 0 ] }
    ]

  });

这很好。 我正在尝试使用以下代码将图像添加到第一个<td>

      deleteImage = $('<img />').attr('src', '../../img/details_close.png');           
      $('td',row).eq(0).append(deleteImage);      
      $('td',row).eq(0).addClass( 'icons' );

这也很好。 它添加图像,并将类添加到特定的<td>

我的问题是,我还想向该图像添加一个id ,以便可以使用Javascript调用click event ,但是到目前为止,我的所有尝试均无效,包括:

deleteImage = $('<img />').attr('src', '../../img/details_close.png', 'id','deleteLine');        

deleteImage = $('<img />').attr('src', '../../img/details_close.png');       
      deleteID = $('<img />').attr('id', 'deleteLine');
      $('td',row).eq(0).append(deleteImage);      
      $('td',row).eq(0).append(deleteID);   

(这第二个确实向我的页面添加了<img id="deleteLine"> ,但它与使用$('td',row).eq(0).append(deleteImage);插入的图像是分开的,因此对我没有帮助。)

我只是不知道确切的语法来使它工作.....

如果其他人遇到相同的问题,请执行以下操作:

deleteImage = $('<img />').attr({ src:'../../img/details_close.png',id:'deleteLine'}); 

只需将要添加的各种元素包装在{}中,每个元素之间用逗号分隔即可。