如何使用jQuery DataTables在单元格中显示超链接

我将一些Ajax数据读入jQuery DataTables.问题是我需要将第一列中的数据转换为超链接.如在< td>< a href =“5555.html”> 5555< / a>< / td>中那样.

我的JSON数据:

{
   "data": [
      ["5555","07/17/2010","RCC Saturday Open","E10","Harris,Fred","1900","Nikolayev,Igor (FM)","2367","1-0"],["5554","B01","Motroni,Richard","1728","1-0"]
   ]
}

JavaScript的:

$(document).ready(function() {
   $('#cccr').DataTable( {
      "render": function ( data,type,row ) {
         return '<a href="basic.PHP?game=' + data + '></a>'; //doesn't work
      },"ajax": 'games.json',"deferRender": true
   } );
} );

我对JavaScript知之甚少.在谷歌搜索datatables.net网站几小时后,我无法弄明白.

有人可以帮忙吗?

解决方法

原因

选项呈现应该是列或columnDefs的子属性.

使用columnDefs.render选项动态显示单元格中的超链接.

例如:

var table = $('#cccr').DataTable({
    /* ... skipepd other options ... */
    columnDefs: [
        {
            targets: 0,render: function ( data,row,Meta ) {
                if(type === 'display'){
                    data = '<a href="basic.PHP?game=' + encodeURIComponent(data) + '">' + data + '</a>';
                }

                return data;
            }
        }
    ]      
});

DEMO

有关代码和演示,请参见this jsFiddle.

相关文章

jQuery插件的种类 1、封装对象方法 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进...
扩展jQuery插件和方法的作用是非常强大的,它可以节省大量开发时间。 入门 编写一个jQuery插件开始于给...
最近项目中需要实现3D图片层叠旋转木马切换的效果,于是用到了jquery.roundabout.js。 兼容性如图: ht...
一、什么是deferred对象? 开发网站的过程中,我们经常遇到某些耗时很长的javascript操作。其中,既有异...
AMD 模块 AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一...