如何在jQuery中为DataTable子行的<td>标签绑定动态URL链接

该需求可以实现，只需修改format函数中Delete Account文本部分的HTML结构，动态拼接a标签即可。

实现逻辑 #

• 将原本纯文本的Delete Account替换为<a>标签，把基础URL和d[0]的取值拼接后赋值给href属性
• 建议用encodeURIComponent处理d[0]的取值，避免参数带特殊字符时出现URL解析错误
• 原代码中</tr>和</table>的拼接处缺少加号，会触发语法错误，修改后的代码已同步修复该问题

完整修改后代码 #

function format(d){
     // `d` 是当前行的原始数据对象
     return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">' +
         '<tr>' +
             '<td>Active Indicators:</td>' +
             '<td>' + d[5] + '</td>' +
         '</tr>'+ 
         '<tr>' +
             '<td><a href="http://example.com/delete.php?account=' + encodeURIComponent(d[0]) + '">Delete Account</a></td>' +
             '<td>' + d[0] + '</td>' +
         '</tr>' +
     '</table>';  
}

扩展配置 #

如果需要点击链接时在新标签页打开，给a标签添加target="_blank"属性即可，对应代码片段为：

<td><a target="_blank" href="http://example.com/delete.php?account=' + encodeURIComponent(d[0]) + '">Delete Account</a></td>

内容的提问来源于stack exchange，提问作者Sam