Min-Max 加载其他功能时过滤器不起作用

Question

01) 我有一个 JSON URL 并且我通过外部 .js 文件将数据动态加载到 HTML table 中。

02) 我有一个名称过滤器（第一列）。（效果很好）

03) 我对每一行都有一个乘法函数。（效果很好）

04) 我有一个用于 3d 列的 min-max 函数。（它不工作，虽然它曾经工作）。

link 在这里：LINK

代码显示在这里：

function minmax() {

    filters();
    $.fn.dataTable.ext.search.push(function(settings, data, dataIndex) {
        return parseFloat(data[2]) >= parseFloat($('#counter-low').val() || data[2]) &&
            parseFloat(data[2]) <= parseFloat($('#counter-high').val() || data[2]);
    });

    var table = $('table').DataTable();
    $('#counter-low, #counter-high').on('keyup', table.draw);
}

这里我也是在调用里面的过滤函数。我不知道为什么它不起作用。

UPD ：我更改了 header 中的调用顺序，现在效果更好了。但仍然没有 100% 工作。

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script src="js/jquery.min.js"></script>
  <script src="js/jquery.multiselect.js"></script>
  <script type="text/javascript" language="javascript" src="js/jquery.dataTables.min.js"></script>
  <script type="text/javascript" language="javascript" src="js/allinone.js"></script>

Answer 1

我无法理解 dataTable 的来源，但实际上 $.fn.dataTable 似乎不可用，命令 $('table').DataTable();

也许您缺少提供此功能的脚本，但如果您只是想隐藏行，您可以使用类似 min/max 中的内容（目前它只是 min - 我没有完成它 - 只是测试过）：

$('table').children('tbody').children('tr').filter(
function (key, element) {
    if (
        parseFloat($(element).children(':nth-child(3)').text())
         < parseFloat($('#counter-low').val())
        ||
        parseFloat($(element).children(':nth-child(3)').text())
         > parseFloat($('#counter-high').val())
    )
        return true;
    else
        return false;
}).css('display', 'none');

Answer 2

检查脚本的执行顺序，如果它正常工作，您可能会更快地注意到它。还要检查 Web 控制台中的 console.log() 错误。顺便说一下，<script> 标签中的语言属性已经弃用了很长时间，不应该使用。这些天甚至不需要打字。此外，您有两个 jQuery 版本。

<script src="js/jquery.dataTables.min.js"></script>

Min-Max 加载其他功能时过滤器不起作用

Min-Max filter does not work when other functions are loaded

javascript

html

filter

minmax