首页 > 解决方案 > 使用括号、'%' 符号和逗号时,数据表无法正确排序。简单的 JsFiddle

问题描述

我想对一列充满不同符号的单元格进行排序,包括“%”、逗号和“()”。我尝试实现数据表插件格式化数字。它没有用。我还尝试使用插件负括号,但我无法将其完全放入代码中。如果您查看我的 jsfiddle,我将不胜感激。我想让我的代码假装没有符号,并根据数字的唯一存在进行排序。任何帮助将不胜感激。jsFiddle:https ://jsfiddle.net/5gqpn8c9/

$(document).ready(function() {
  
    $('#example').DataTable({
      "bPaginate": true,
      "bLengthChange": false,
      "bFilter": true,
      "bInfo": false,
      //"scrollY": "425px",
      "scrollCollapse": false,
      "order": [
        [2, "desc"]
      ],
      "bAutoWidth": false
    });

  });
<script src="https://code.jquery.com/jquery-3.5.1.js">
</script>

<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js">
</script>
<script src="https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js">
</script>

<head id="head">

  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Covid-19 Dashboard</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css">
  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap4.min.css">
  </head>
  <body>
  <div>
  <table id="example">
  <thead>
    <tr>
      <th scope="col">#</th>
      <th scope="col">First</th>
      <th scope="col">Last</th>
      <th scope="col">Handle</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">1</th>
      <td>Mark</td>
      <td>102(1%)</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <th scope="row">2</th>
      <td>Jacob</td>
      <td>103(2%)</td>
      <td>@fat</td>
    </tr>
    <tr>
      <th scope="row">3</th>
      <td>Larry</td>
      <td>104(1.00%)</td>
      <td>@twitter</td>
    </tr>
    <tr>
      <th scope="row">1</th>
      <td>Mark</td>
      <td>5,545(3.83%)</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <th scope="row">2</th>
      <td>Jacob</td>
      <td> 552(4.51%)</td>
      <td>@fat</td>
    </tr>
    <tr>
      <th scope="row">3</th>
      <td>Larry</td>
      <td>10,7(2%)</td>
      <td>@twitter</td>
    </tr>
  </tbody>
  </table>
  </div>
  
  </body>

标签: datatables

解决方案


推荐阅读