使用DataTables时遇JSON.stringify is not a function错误，求解决

这个错误十有八九是因为你传给JSON.stringify()的不是可序列化的原生JavaScript对象/数组——大概率是直接把DataTables的API结果或者jQuery对象丢进去了，而非提取出的行数据。咱们一步步来搞定它：

1. 正确获取选中行的可序列化数据 #

DataTables的select插件提供了rows('.selected')方法定位选中行，但你得用.data().toArray()来提取原生数据数组（而不是API对象本身）。示例代码如下：

$('#save').on('click', function() {
  // 把选中行转成原生JS数组
  var selectedRows = table.rows('.selected').data().toArray();
  // 现在就能正常序列化了
  var jsonData = JSON.stringify(selectedRows);
  console.log(jsonData);
});

这里的核心是.toArray()——table.rows().data()返回的是DataTables的API结果集，不是普通数组，转成原生数组后，JSON.stringify才能正常处理。

2. 排查其他潜在问题 #

如果上面的方法没解决，检查这几点：

• 确保table变量在点击事件的作用域内可访问：你现在把table定义在$(document).ready()回调里，如果点击事件也在这个回调内就没问题；如果在外部，需要把table提升为全局变量
• 别意外覆盖JSON对象：如果你自己定义过名为JSON的变量，会覆盖原生JSON对象，导致stringify方法丢失
• 检查数据是否有循环引用：如果行数据里存在对象互相引用，也会序列化失败，但这种情况报错通常是"Converting circular structure to JSON"，如果还是"not a function"，优先排查前两点

完整可运行示例 #

把初始化和点击事件整合到一起，完整代码如下：

$(document).ready(function() {
  var table = $('#example').DataTable({
    "order": [],
    "processing": true,
    "searching": false,
    "paging": false,
    "autowidth": true,
    'select': {
      'style': 'multi'
    },
    "columnDefs": [
      { orderable: false, targets: '_all' }
    ]
  });

  // 绑定save按钮点击事件
  $('#save').on('click', function() {
    var selectedData = table.rows('.selected').data().toArray();
    try {
      var jsonString = JSON.stringify(selectedData);
      console.log('序列化成功:', jsonString);
      // 这里可以继续处理JSON，比如发送到后端
    } catch (error) {
      console.error('序列化失败:', error.message);
    }
  });
});

错误根源复盘 #

如果你之前直接把table.rows('.selected')或$('.selected')传给JSON.stringify，前者是DataTables的API对象，后者是jQuery对象，都不是原生可序列化数据，自然会触发错误。一定要先提取纯数据数组再进行序列化操作。

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