Jquery 如果输入范围值与th id匹配，则将类添加到表th

首先，让我为我编写jQuery的拙劣尝试道歉。我是一名设计师

我有一个表，当范围输入值与

id匹配时，我想向

添加一个活动类

HTML:

---

我意识到我还需要在更改时取消激活类的设置，但我只是想让jQuery先添加一个类。

尝试以下方法：-

$(document).ready(function(){
    $('input[type=range]').change(function() {
        var rangeval = $(this).val();
        $('#levels th').removeClass();
        $('#levels th#' + rangeval).addClass('active');
    });
});

---

试试这样的方法：-

$(document).ready(function(){
    $('input[type=range]').change(function() {
        var rangeval = $(this).val();
        $('#levels th').removeClass();
        $('#levels th#' + rangeval).addClass('active');
    });
});

---

您不需要使用

if

语句，因为您可以根据范围

输入的值构建id选择器。试试这个：

$('[type=range]').change(function() {
    $('th').removeClass('active').filter('#' + this.value).addClass('active');
});


请注意，上面删除了先前在任何元素上设置的
active
类，以便一次只能显示一个活动。
您不需要为此使用
if
语句，因为您可以根据范围
输入的值构建id选择器。试试这个：

$('[type=range]').change(function() {
    $('th').removeClass('active').filter('#' + this.value).addClass('active');
});


请注意，上面删除了先前在任何元素上设置的
active
类，以便一次只能显示一个活动元素。
u正在使用ID选择器，因此应该类似于

var th = $("#levels th");

否则，它会将其视为标记名。
u正在使用ID选择器，因此应该类似于

var th = $("#levels th");

否则它会将其视为标记名。
确保您的
id
级别选择器正确无误

然后，您可以执行以下操作：


从
th
中删除所有活动类
向与所选值匹配的类添加并激活

$(document).ready(function(){
    $('[type=range]').change(function() {
        var rangeval = $(this).val();

        // remove 'm all
       $("#levels th").removeClass('active');

        // add active
        $("#levels th#" + rangeval).addClass('active');

    });
});



演示：
确保
级别的
id
选择器正确

然后，您可以执行以下操作：


从
th
中删除所有活动类
向与所选值匹配的类添加并激活

$(document).ready(function(){
    $('[type=range]').change(function() {
        var rangeval = $(this).val();

        // remove 'm all
       $("#levels th").removeClass('active');

        // add active
        $("#levels th#" + rangeval).addClass('active');

    });
});



演示：