Tablesorter 忽略 div 中的一些数据

Question

我需要用原来的 table 排序器对 table 中的数字进行排序。

我的问题是：
在我的 table 中，我有一个我想整理的 TD，但是在这个 TD 中，我有一些 DIV 就像在这个 jsfiddle 中：

$(function() {
  $.tablesorter.addParser({
    id: 'colpap',
    is: function(s) {
      return false;
    },
    format: function(s) {
      var number = parseFloat(s.replace(/\s+/g, ''));
      return isNaN(number) ? s : number;
    },
    type: 'numeric'
  });
  $('table').tablesorter({
    theme: 'blue',
    headers: {
      0: {
        sorter: 'colpap'
      }
    }
  });
});

<table class="tablesorter">
  <thead>
    <tr>
      <th>Value</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>256 236
        <div class="info" style="background-color: rgb(166, 194, 255);">6 236</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">5 000</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">11 253</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">233 747</div>
      </td>
    </tr>
    <tr>
      <td>11 256 232
        <div class="info" style="background-color: rgb(166, 194, 255);">4 253 620</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">3 501 306</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">3 501 306</div>
      </td>
    </tr>
    <tr>
      <td>23 056
        <div class="info" style="background-color: rgb(166, 194, 255);">20 000</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">3 056</div>
      </td>
    </tr>
    <tr>
      <td>11 536
        <div class="info" style="background-color: rgb(166, 194, 255);">1 536</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">2 500</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">7 500</div>
      </td>
    </tr>
    <tr>
      <td>1 023 585
        <div class="info" style="background-color: rgb(166, 194, 255);">1 023 585</div>
      </td>
    </tr>
  </tbody>
</table>

我们看到性别不起作用，因为 DIV 寄生虫分类！我认为这只会忽略 DIV 工作排序

Answer 1

要忽略其他数据，您只需在格式化程序中使用第一行：

var number = parseFloat(s.split('\n')[0].replace(/\s+/g, ''));

完整代码位于 Updated Fiddle.

详情如下：

$(function() {
  $.tablesorter.addParser({
    id: 'colpap',
    is: function(s) {
      return false;
    },
    format: function(s) {
      var number = parseFloat(s.split('\n')[0].replace(/\s+/g, ''));
      return isNaN(number) ? s : number;
    },
    type: 'numeric'
  });
  $('table').tablesorter({
    theme: 'blue',
    headers: {
      0: {
        sorter: 'colpap'
      }
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://tablesorter.com/__jquery.tablesorter.min.js"></script>
<link href="http://tablesorter.com/themes/blue/style.css" rel="stylesheet"/>

<table class="tablesorter">
  <thead>
    <tr>
      <th>Value</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>256 236
        <div class="info" style="background-color: rgb(166, 194, 255);">6 236</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">5 000</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">11 253</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">233 747</div>
      </td>
    </tr>
    <tr>
      <td>11 256 232
        <div class="info" style="background-color: rgb(166, 194, 255);">4 253 620</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">3 501 306</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">3 501 306</div>
      </td>
    </tr>
    <tr>
      <td>23 056
        <div class="info" style="background-color: rgb(166, 194, 255);">20 000</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">3 056</div>
      </td>
    </tr>
    <tr>
      <td>11 536
        <div class="info" style="background-color: rgb(166, 194, 255);">1 536</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">2 500</div>
        <div class="info" style="background-color: rgb(166, 194, 255);">7 500</div>
      </td>
    </tr>
    <tr>
      <td>1 023 585
        <div class="info" style="background-color: rgb(166, 194, 255);">1 023 585</div>
      </td>
    </tr>
  </tbody>
</table>

Tablesorter 忽略 div 中的一些数据

Tablesorter ignore some data in div

javascript

jquery

tablesorter