jQuery 数据表抑制科学记数法答案

【问题标题】：jQuery datatables suppress scientific notationjQuery 数据表抑制科学记数法
【发布时间】：2021-09-30 00:28:40
【问题描述】：

我正在使用数据表来呈现表格并显示来自我的 api 的数据。

<script type="text/javascript">
$.fn.dataTable.ext.errMode = 'throw';
$(document).ready(function (){
    var table = $('#example').DataTable({

        'ajax': {
            'url': '/api/books',
            'dataSrc': '',

        },
      "language": {
        "emptyTable": "Nothing to show",
    },
      "columns": [
            { "data": "price", render: $.fn.dataTable.render.number(',', '.', 8, ''), "width":"40%"  },
            { "data": "amount", render: $.fn.dataTable.render.number(',', '.', 8, '') },
            { "data": "sum", render: $.fn.dataTable.render.number(',', '.', 8, '') },
           
        ],
       "scrollY":        "300px",
       "scrollCollapse": true,
       "autoWidth": false,
       "lengthChange": false,
       "ordering": false,
       "pageLengt"': 50,
       "bFilter": false,
       "bPaginate": false,
       "bInfo": false,
       "bSort": false,
       "createdRow": function( row, data, dataIndex){
        
                [...more code here...]
});

</script>

此代码运行良好，但任何

【问题讨论】：

提高精度有帮助吗？如果不是，您最好将值呈现为字符串
我还没试过。我会告诉你的！
提高精度没有帮助

标签： jquery datatables numbers

【解决方案1】：

您可以在 DataTables 列渲染器中使用 JavaScript Intl.NumberFormat 对象：

Intl.NumberFormat('en', { maximumSignificantDigits: 15 }).format(1234.00000000123);

这是一个演示：

var dataSet = [
    {
      "name": "Tiger Nixon",
      "amount": 1234.00000000123
    }
  ];

$(document).ready(function() {

var table = $('#example').DataTable( {
  data: dataSet,
  columns: [
    { 
      title: "Name", 
      data: "name" 
    },
    {
      title: "Amount", 
      data: "amount",
      render: function ( data, type, row, meta ) {
        if (type === 'display') {
          return Intl.NumberFormat('en', { maximumSignificantDigits: 15 }).format(data);
        } else {
          return data;
        }
      }
    }
  ]

} );

} );

<!doctype html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Demo</title>
  <script src="https://code.jquery.com/jquery-3.5.1.js"></script>
  <script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.js"></script>
  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.22/css/jquery.dataTables.css">
  <link rel="stylesheet" type="text/css" href="https://datatables.net/media/css/site-examples.css">

</head>

<body>

<div style="margin: 20px;">

    <table id="example" class="display dataTable cell-border" style="width:100%">
    </table>

</div>

</body>
</html>

问题中使用的插件使用 JavaScript parseFloat() 函数，如您所见，如果值足够小，该函数会将值转换为科学记数法 - 就像您给出的示例一样：

parseFloat(0.00000099) -> 9.9e-7

【讨论】：