Jquery 具有多个范围滑块的过滤器 table

Question

前几天我问了几乎同样的问题

我得到了一个快速而好的答案，而且我认为我可以自己更改它以使其接受多个范围滑块并过滤所有滑块。我尝试编写这样的函数：

function slide(){
    var table = document.getElementById("ADC_DAC");
    for (var i = 1, row; row = table.rows[i]; i++) {
       //iterate through rows (we SKIP the first row: counter starts at 1!)
       for (var j = 0, col; col = row.cells[j]; j++) {
           //iterate through columns: if first column not in range: HIDE, else SHOW

            //if (j == 0) {             // if first column
            if ($(col).html() >= indexmin && $(col).html() <= indexmax && j == 0) {
            // if in interval
                $(row).show();
            } else if ($(col).html() >= minvoltmin && $(col).html() <= minvoltmax && j == 7){
                if (j==7) {
                    $(row).show();
                }
            }else{
                $(row).hide();
            }
        }  
    } 
}

indexmin, indexmax, minvoltmin and the minvoltmax 是滑块的最小值和最大值。 indexmin 必须在第一列中过滤，minvoltmin 用于第 8 列。

预期的输出是 table，当您移动滑块时会发生变化，但它只是清除 table 并且之后不再发生变化。

提前感谢您的帮助:)

Answer 1

我不知道如果你找到了答案，你是否应该回答你自己的问题，但我找到了:D

function slide(){
var table = document.getElementById("ADC_DAC");
for (var i = 1, row; row = table.rows[i]; i++) {
    //iterate through rows (we SKIP the first row: counter starts at 1!)
    for (var j = 0, col; col = row.cells[j]; j++) {
        //iterate through columns: if first column not in range: HIDE,else SHOW                                                                    
        // if first column
        if ($(table.rows[i].cells[0]).html() >= indexmin && $(table.rows[i].cells[0]).html() <= indexmax && $(table.rows[i].cells[7]).html() >= minvoltagemin && $(table.rows[i].cells[7]).html() <= minvoltagemax) {
            // if in interval
            $(row).show();
        } else {
            $(row).hide();
        }                                                                     
    }  
} 
}

每次其中一个滑块移动时都会执行 slide() 函数。

希望对大家有所帮助:)

Jquery 具有多个范围滑块的过滤器 table

Jquery filter table with multiple range sliders

html

javascript

jquery

filtering

jquery-ui